JQuery Image Slideshow [NO PLUGIN] Delay Between Images??!

  • Scott G.

    (@sgodar)


    11 years, 11 months ago

    The title pretty much sums it up. I’m not sure if this is the correct sub-forum… But I’ll give it a shot and hope someone can gimme some help!

    I’m trying to get an Java/JQuery featured img slider on the home page of my site (testing site (http://test.madadmedia.com)). If you go there you notice I sped up the the cycling b/c I wanted to see if I could get the blank white between image transitions to go away… But it doesn’t!

    I DO NOT want to use a plugin — don’t need a plugin for something that should be SO simple. What’s weird is that the JQuery code works, runs, flows seamlessly/perfectly on a blank.html page.

    I’ve added the CSS to the stylesheet, have the script added to the header, I don’t know how to solve this problem… I’m not a java guy (if that’s even the problem…

    Or does wordpress just not like java..?

    Any help would be greatly appreciated PLEASE! I want the images to actually fade out and fade into the other WITHOUT the seconds of WHITE!

    Here’s what it is… Save it to notepad (example.htm) and drag the below code into a browser and it works perfectly… but not on the site…

    <html>
<head>
<title>JQuery Cycle Plugin - Basic Demo</title>
<style type="text/css">
.slideshow { height: 220px; width: 595px; margin: auto }
.slideshow img { padding: 0px; border: 1px solid #777777; background-color: #eee; }
</style>
<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
		fx: 'fade',
		speed: 1000,
		timeout: 3000,
		pause: 1
	});
});
</script>
</head>
<body>
	<div class="slideshow">
		<img src="http://www.madadmedia.com/img/001.jpg" width="595" height="220" />
		<img src="http://www.madadmedia.com/img/002.jpg" width="595" height="220" />
		<img src="http://www.madadmedia.com/img/003.jpg" width="595" height="220" />
	</div>
</body>
</html>
Viewing 1 replies (of 1 total)
  • bcstavely

    (@bcstavely)

    11 years, 6 months ago

    Sgodar,

    I followed your link to see that you have fixed the issue. What did you have to do to make the delay stop? I am having the same problem and am clueless.

Viewing 1 replies (of 1 total)
  • The topic ‘JQuery Image Slideshow [NO PLUGIN] Delay Between Images??!’ is closed to new replies.