开发者

jquery based slideshow/transitions for HTML content

Searching for rotators based on JQuery only finds the original rotator plugin and a bunch of photo galleries, which I don't want. Please suggest other rotators available. The rotator should be able to rotate HTML no开发者_JS百科t just images (like the Glimmer tool, which can create JQuery/HTML code for rotating images).


Why use plug-in's? use this one liner (i just separated it into 3 lines for the sake of readability)

see demo

Your HTML should be something like this

HTML

<div class="yourContainer">
 <div>some html</div>
 <div>other html</div>
</div>

JS / jQuery

$(function(){
    $('.yourContainer div:gt(0)').hide();
    setInterval(function(){$('.yourContainer :first-child').fadeOut().next().fadeIn().end().appendTo('.yourContainer');}, 3000);
});

CSS (optional = makes transition smoother)

.yourContainer{ position:relative;}
.yourContainer div{ position:absolute; hight:300px; width:300px; background:red; }


How about:

  • jQuery Cycle Plugin
  • jQuery Flip Plugin

You can even modify/customize these plugins to create the kind of effect you want.


link text is pretty cool. They show an example from a payroll company in their demos that even degraded nicely without Javascript.


I created a simple plugin called Basic jQuery Slider. It's simple and clean and just does what it's supposed to. If you decide to use it and have any questions, just ask and I'll help you out.


I actually ended up using the SlidesJS. This one by Zurb is also great.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜