JQuery :: Using The Malsup Image Cycle Where The Images Suddenly Appear Shrunken
Jan 14, 2011
Regarding a previous post of mine: jquery-cycle-plugin-24-12-2010 I seem to have a problem using the Malsup Image Cycle where the images suddenly appear shrunken. It appears to only affect me when using ASP.NET with site.master pages the problem doesn't occur every time just occassionally. I tried recreating the glitch outside of ASP.NET (simply using HTML, CSS etc......) but it worked fine. I will soon try and recreate the problem in a sample ASP.NET project and post the code on this thread as soon as it's ready.
I am working with MODx CMS. Following website: Carlindesign I integrated the cycle plugin on the home. It works but after the cycle is done the cycle call shows up instead of the next cycle.
I am using the awesome malsup cycle plugin, but it seems like the sync: true option isn't working 100% synchronous. If I activate the sync option and let exactly the same images fade, a short opacity effect occurs. $(document).ready(function() { $('.slideshow').cycle({ fx: 'fade', sync: true, speed: 1000, timeout: 4000 });}); <div class="slideshow"> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> <img src="[URL]" width="200" height="200" /> </div> I would like to fade some images with only few differences, and for the user it should look like only those few parts of the image change.
I'm trying to do a goto thing with the cycle plugin. I've succeeded with the same thing before. The only thing that happens now is that it goes to the first index/restarts.
$('#id').cycle(n); always gets me the first slide. I've checked that the n value is a number/integer. The only thing I can come up with is some kind of conflict.I'm also using jcarousel but when I deactivate that it's the same problem.
Does anybody have clue about what might be going on? Or maybe how to troubleshoot?
i'm having a small problem with getting the captions to display from a slideshow... i've got multiple slideshows on the page which i guess could be causing the problem... i'm not getting any errors, but no caption is being displayed... here is a section of my html....
Using the minified jQuery Cycle Lite Plugin (only 3kb) is very very attractive for the project I'm working on. I'm trying to make cuts in load time and 99% of my site would only requires the fade transition, however one area needs the 'scrollUp' effect. How hard would it be to add that effect to the Lite version of the plugin?
I have a Cycle Plugin carousel of 20 product thumbs split into 4 slides of 5 thumb images each slide. This scrolls horizontally forwards and backwards with left/right navigation. This carousel is situated below the products being displayed. The user can navigate forwards and backward through these 4 slides, however, when they pick a product to look at the carousel always resets itself back to the first slide. How can I set it so that when an image in one of the 4 slides is clicked and we move to that product's page, that slide stays active when the page loads? It's annoying to have to scroll back through the 4 slides to find the one that had the active product on it.
I am using the Cycle plugin with the turnLeft fx. After loading, the very first slide that transitions, doesn't actually "turn".It shrinks along the z-axis up to the upper left hand corner of the div. After that the transition "turns" correctly. It doesn't matter which slide it is, I have tried using the pager to select different slides in the list...as long as it is the very first transition, I have this problem.I tested the other "turn" fx's and turnRight shrinks up to the right hand corner, turnDown shrinks to the lower left hand corner, turnUp works just fine and does not have this first slide issue.I have this problem in all major browsers. I did notice that the jQuery Cycle homepage examples for the browser effects does not have this problem. Could there be anything I'm doing wrong? The call to Cycle is burieda bit in some other code but the call is pretty straight forward...the "options.imageFx" passed in is "turnLeft":[code]
I am using the jquery cycle plugin for a fade in/out content gallery for a site's news section - you can see it at: [URL] under the News & Articles section. The plugin works perfectly in Firefox, but I am seeing a white background in IE. Does anyone know how to fix this? It looks like it's an opacity issue. Here is my cycle code:
I have been running the cycle plugin with success for a while, using 3 images, a caption, and a pager area (simple dots). I just added a fourth image/caption. the pager picks up the fourth image, adding a dot. However, it now fades in on transition, then immediately out. no other code changed other than the addition of a fourth image. why this is now malfunctioning?
I'm trying to get a next/previous arrow to float over the right/left edges of a slideshow div. I'm using to absolutely positioned divs to contain the next/previous buttons but for whatever reason they refuse to display above the slideshow div. Is there any way to get controllers to float over the cycle container?
Here's my code and if you give it a try you won't see the floating next/previous buttons unless you change the 'top' values for #next_btn and #prev_btn in the CSS to be greater than the height of the image (change to 410 to see them in my example):
I have the cycle plugin running, works fine on all but IE7 (not catering to IE6). The pager elements on the right do not appear in IE7. I have tried adjusting the z-index, etc., but can't figure it out.
Also, the caption text transitions in with bolded elements properly appearing, and then they flip to regular text (the whole line of text transitions a bit strangely).
- works as expected in that one photo fades into the next photo smoothly. Test page looks great - [url]
However, when I put the exact same code into Thesis/WordPress, I get a long delay between the images, and spend several seconds looking at a blank stage - [url]
Why would that be? How to make the images transition fade smoothly into the next image
I have re-styled the tabs of the pager with css so its not orange anymore. Instead the active and the inactive tabs have a background image. What I need to do now is remove the numbers, but I do not know how to. Can someone please tell me how to do so?
I'm busy creating a website and I've implemented a gallery of sorts using this script below to make it move the images, however when it gets to the end of the cycle of images it reads the last image as the last one to reach the left hand side which is obviously quite unattractive. So all I would like to know is if there is someone who can alter this code to make it so the last image is read on the right of the block thus resulting in no blank blocks. You can view it in action at http://mcphotography.co.za/corporate.html.
malsup has kindly created this progressbar but hasn't explained how to implement it into his cycle plugin. [URL] I am trying to get the progressbar to reset if the user clicks next/previous slide. what I am using:
I have to do a slideshow with images of different widths... am using cycle plugin, which I like very much... I have a little test slideshow here, http:[url]....it's not centering imgs in containing div (I made div width of widest image.. this will work for my situation, in which imgs will be hard-coded..)if you inspect img element in firebug (#slideshow img), it shows that the plugin adds a style of position: absolute; top: 0px; left: 0px .to the img; why does the plugin do this.. how can I center the images in containing div...
Iīve just launch my website-portfolio, well itīs not yet the final version but it is almost and despite I am satisfied with the final result Iīve detected a really strange bug that only happens sometimes. The thing is when the first introduction Slide appears (the one with the hand-made drawings), sometimes the images shrink from the normal size to small tiny images. This doesnīt happen always and if you refresh the page it disappears.
Follow the link to the page were the bug happens - [url]. I'm using jquery cycle plugin, check it out.
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'm using Cycle to transition multiple (8) images at one time. I want to fade in the first 8. In a slideshow where only 1 image displays at a time, the Cycle FAQ advises using the following code to fade in the first image:
This doesn't work on IE or Firefox at all; it kind of works on Safari, in thatthe fade actually works. However, this seems to have also changed the behavior of the slideshow. For some of the cycles, instead of sliding the slides off the page, it hides the old slides and slides in the new ones.
I used the amazing jQuery Cycle plugin to create a slideshow on a site. It worked great, but one day a couple of weeks ago we got email from a couple of clients with screenshots of improperly sized images. It appears to be the same issue described here, exacerbated by the fact that the page background image is just over half a megabyte: URL...
The clients were using IE 7 and 8 on Windows XP. We were able to reproduce it consistently with Firefox after a hard refresh, but only one person out of our nine-person office was able to reproduce it in IE (IE8, Windows 7) and then only intermittently.When the issue occurred, I was setting up my slideshow in $(document).ready(). I switched it to $(window).load(), and we could no longer reproduce it in FireFox or IE.My question: can I conclusively say that the issue was the same (timing issue, solved by switching to window.load) in FireFox and IE? Management is unsettled by the fact that we couldn't reliably reproduce or explain it in IE, and I've been asked to investigate further.
