JQuery Cycle plugin: overlay nav buttons?
I'm trying to using the jQuery cycle plugin (http://www.malsup.com/jquery/cycle/) to create a banner like the one on this page: http://www.epa.gov/. Specifically, I'd like the navigator buttons to lay on top of the images. The way it is done on epa.gov is the nav div is absolutely positioned on the page, so you have to absolutely position that div on every page you want to use it on. The easier solution would be to relatively position the nav div in the div that holds the images I want to scroll. The problem is I don't see how you can do that.
The code for cycling images is:
$('#banner').after('<div id="nav"></div>').开发者_高级运维cycle({ fx: 'fade', speed: 1000, timeout: 5000, pager: '#nav', autostop: true, autostopCount: 5 });
the "after" function creates the nav div and the pager option makes that div the navigation for the banner div, which holds the images, but the nav div is created either before or after the banner div. I want the nav div to be created inside the banner div so that I can relatively position it in that div, since it is the one that actually holds the images. Is this possible? Is there a different plugin I should be using for this?
There's actually a very similar example right on Malsup's example page here:
http://jquery.malsup.com/cycle/pager-over.html
Go to 'even more demos', and it's the top one (pager on top of slideshow).
It was hard to find, and the only reason that I know it was there was because I've spent hours there!
精彩评论