JQuery :: Get Cycle Plugin Working When 1 Of Hidden Div Is Visible?
Dec 16, 2011
It works when its on its own page but when I place the code in a hidden div that becomes visible on click, it doesnt work.What do I do to get the cycle plugin working when 1 of the hidden div is visible?
I am currently developing a site for a client which uses the JQuery cycle plugin to move through a number of divs which contain pictures and info about wedding dresses. All works fine in Firefox, but when I test in IE6 + IE7 the divs are all stacked on top of each other vertically and they soan right down the screen for 1000's of pixels. To me it seems like this is a problem with absolute/relative positioning or the z-index, I have also used a few floats in the child divs. I am also using SIFR for text replacement, could this be conflicting? Here is my code, can anyone see a problem that would cause my cycle not to work in IE.?
-------------- XHTML -------------- <code> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
I am trying to add a reflection to an image inside of a cycle slide show. reflection works fine until I add the slide show. The background of the reflection is white. I tried setting the background for the element to none !important but it didn't do the trick.
I have yet to be able to do this successfully. I am using the Cycle Plugin to cycle through a series of images and corresponding caption. To show the images, I use:
Problem: The captions do not effectively cycle. What appears is the first caption from php the_excerpt but it does not change to the next php the_excerpt text. Can I solve this problem so I get the text from php the_excerpt to correspond to each image??
I have a href tag in my pager. When I click on it the slide changes to the ppropriate pager but the I don't get sent to the link even though allowPagerClickBubble is set to true. This works fine when pagerEvent is 'moveover' (as in the exaple posted here) ie. I get sent to the linked page. But it does not work when pagerEvent is the default 'click.cycle'.
I am having an odd error where the pager generates links but they don't change the slide in FF and Safari. The biggest surprise of all is that it actually works in IE. Here is the page I am referring to: http://76.12.208.222/
The problem is that it stop working of Firefox after about two hours. I used it on the main page and leave it working and afterabouttwo hours the picture stop moving and there is only one pictureshown.
I am trying to make the jQuery Cycle Plugin - Auto-pager work, but it hasn't worked for me. The first image displays, but it just will not change and display the pagnition.
I am trying to get a simple set of Javascript tabs to work properly. I have just two tabs and I want to set up the script to have the second tab automatically hidden prior to reading the javascript code because right now it shows the contents of both tabs when the page is loading and then the second tab disappears after all the script has loaded.
I have the jquery script linked to on the page and here is the way my script looks to run the tabs:
Code:
I want to add something like style="visibility:hidden;" to the DIV that isn't shown on page load and have it added and removed as necessary when users click on the tabs. So basically I would like the generated code to look like this:
I am having an issue with pausing the cycle from links within the cycle. I have set up a cycle that contains a html contentent including a 'video playlist'. This is a javascript based list that updates a flash video player with a new video inside the cycle. The videos are loading fine, but for some reason when i call the cycle 'pause', it dosent work? i have testing the $('#feature').cycle('pause'); from a link outside the cycle and that seems to be working, but it seems to be from the links inside the cycle content. here is the code i am using (i have made a custom crossfade transition)
function feature() { $('#featuretitle').hide(); $('#feature').after( '<div id="featurenav"></div>'
I'm using the Cycle plugin to display images for some of my past projects onhttp:[URL]..projekteMy problem is that in Chrome i get the above error in console.([cycle] terminating; zero elements found by selector) I have tried manually initializing the Cycle plugin for every project div and that did not help so I went back to my initial code:
I got a problem with the JQuery Cycle plugin, I can't manage to make the "goto" working.
Here is the code :
And here is the HTML :
What's happening is when I click on "test", it does show the alert but it does not go to the 4th slide. Instead, It acts as if it was the first call, therefore the slideshow starts again from the 1st slide with the default options.
I define a cycle in document.ready as per usual. In my cycle I have different sets of images that i want to cycle through and only want certain ones to cycle as selected using the slideExpr option.
Is there a way to change this option from:
SlideExpr: 'a'
To:
SlideExpr: 'b'
Another alternative i've considered is to make a cycle of cycles.
I've worked though a lot of issues trying to get the jQuery cycle plugin working in a relatively complex situation but have hit yet another wall.
Basically, I'm trying to get the jQuery Cycle plugin to cycle through entire divs, each one of which contains yet another slider platform built in jQuery. The first div always displays exactly as it should but when I click to transition, the elements within the second div appear stacked instead of side by side on the slider as they should. I've tried modifying the CSS in every way I can think of to prevent this, but so far, no dice.
I'm not sure whether its an element of the CSS for the second slider platform (wp e-commerce product slider) or one of the two platforms themselves. One thing I did notice was that one of the inner slider divs "gallery_slider" is automatically being set to 90px wide which is way too thin, but I can't seem to figure out how to override this if that is actually the problem.
You can check out the site that I'm trying to implement this on at [url]. The trigger to change the slider div is under "Men's">"Cloth Belts".
I have a class hidden by default at the document ready state. I use the show() function when its parent has been clicked and I want to be able to apply a click function to this newly visible element - when I write it I am finding that it is overriding the initial hide(). How do I work around this? I should say that this element is just a bit of text that says "close x" and will be used to "close" its parent div down...
So, what I'm trying to do is embed links inside a cycle slide show. Here's an example:
[Code]...
As you can see, I'm using a div tag in place of an image and setting the image as the BG of the div. Then I'm overlaying some text and links on the "slide". When I click the links however, the result is animation invocation rather than link target invocation. The div click event is takingprecedenceover the link click event. Is there a built in handler in the Cycle library to handle this?
I have a div tag element and a hide/show button above it. I'm able to handle the hide show of the contents all right via the button, but I want the div to be hidden when someone clicks anywhere else in the document, save inside the div area itself.This functionality is similar to what you see on the sign on panel in twitter.com. Press the sign in, the div sign in panel displays. Press the sign in link OR anywhere else on the document outside the panel. The panel is hidden.What's the best way to script this functionality in jquery?
I'm a bit new to jQuery but am loving it so far.. especially the cycle plugin. I have a strange problem that I've not been able to find the solution to anywhere else. Everything works just fine with the exception of one issue thats causing me problem. I'm using cycle to control 3 different fading animations on my page. On 2 of the animations I'd like to pause cycle after the image fades out for a few seconds but before cycle fades the next image in. The catch is that I want the timing to be different for each pause before the next cycle begins.
The goal is for#hpcontent,#hphead,#hpfade3to fade out all at the same time. Then for#hphead to pause for 2 seconds before it fades in the next random image, and#hpfade3to pause for 3 seconds before it fades in the next random image
I have a code below my concern being tht when the first text box "Name" conatins a value of "TPU" then the sexong text box "Ref Number" should be visible else should not be visible.
I mean the Whole <tr> shall be visible only if "Name = TPU"
Is it possible to expand a table with DIV's using CSS hidden/visible? If I select an option from a select field in one row, to have a hidden select field appear in the row directly below, moving the contents directly below down a row? Expanding the table when a hidden row becomes visible. Or should I just use DIV's and forget about using the table format?
I've downloaded treeview plugin from your website. It's very good tool but when I am selecting any node then all childs become hide only selected child become visible. I've downloaded tree from the following url: [URL].
While I am new to javascript, I've programmed in a dozen other languages for decades, and now have been working in javascript intensively for several weeks. My first comment -- which has nothing to do with this problen -- is on how its richness makes it so difficult to provide adequate reference material. After working only with what I could discover through Google searches and actually writing some nifty fast incremental select element populating code -- what I found on the Web, which has been cited in many locations, is ugly code and sloooow when search a list of, say, 2000 possible entries for inclusion in the box -- just with those hints.
I finally broke down, bought what the reveiws say are the two most complete books -- Javascript Bible and Dynamic HTML, The Definitive Reference (both by Goodman), and am aghast: With the "Bonus Chapters" in the former, they total more than 3,000 pages! And with their in-depth indexes, it's still very difficult to find what one needs. (The HTML and CSS speification publications add another 400 pages . . ..) As a truly elementary example: I wanted to return from a function as a result of a test, not by running it out: The "return" is not indexed, nor are any of the words that might lead one to it. In fact, it is shown in some examples about 980 pages into the book, but nowhere is it actually documented. Yes, I know, every language has a "return" statement, but its usage and syntax varies -- and on some occasions, it's actually called something else.
So, to my current issue. For reasons that are valid -- please don't ask, "Why do you want to do that?" -- I need to hide the page in its entirety until the onload script has altered it based on certain criteria. After doing a lot of brute force stuff -- setting font color to "white", etc., etc. -- I discovered that one can put the attribute style="visibility:hidden" directly in the <body> tag -- which itself is not easily discovered. But: Tables in the body that have a non-zero "border" attribute still show -- just the borders!
Yes, I know I need to learn CSS as well; give me a break, guys! I do have that spec as an HTML doc, and it was there I finally found this out. You know, you can't look such things up by concept in the indexes of either book, or the HTML spec, or the CSS book, unless you already know the term that implements it; if I know the term, I don't need to look it up! In any case, try looking up "hidden" in either book; you get no hint that it can be applied via style to any element. If you know it's available as a style attribute, then know the attribute is "visibility", why than you can find it . . . and by that time, you must know enough that you don't need to find it. (Again, a Google Groups search on words associated with the concept told me what terms to use, and then I didn't need to use the book . . .)
I apologize for the rant (Fortran was good enough for my grandfather, it was good enough for my father, and it's good enough for me -- bah, humbug!), but it's been a very frustrating couple of weeks.
The real question: What about them table borders? So far, I'm defining their values as zero, then setting them to their final values at the same point that I make the body visible. Should I need to do all that? What should make that unnecessary?