trying slide p right left direction jquery slider. slider has fade effect default, i'm trying give slideleft effect p description of slider, not whole slider elements.
html:
<div id="headslide"> <ul> <li class="post-content"> <div class="slidshow-thumbnail"> <a href="#"> <img src="http://3.bp.blogspot.com/-h4-nqvz5-ve/vq3hltss3zi/aaaaaaaabic/iaoda5zoumw/s350-h260-c/girl_with_winter_hat-wallpaper-1024x768.jpg" height="260" width="350"/> </a> </div> <span class="content-margin"> /* description */ <p>cicero famously orated against p...</p> /* title */ <h3><a href="#">download premium blogger templates</a></h3> <span class="info">info</span> </span> </li> <li class="post-content"> <div class="slidshow-thumbnail"> <a href="#"> <img src="http://3.bp.blogspot.com/-yfkf1u_vb40/vwr5dyf00gi/aaaaaaaabw8/wv2e-lu4etw/s390-h340-c-h340-c/11071467_807062866056131_872486685669967339_n.jpg" height="260" width="350"/> </a> </div> <span class="content-margin"> /* description */ <p>seo friendly flat style custom fonts.</p> /* title */ <h3><a href="#">modern pixel-perfect eye</a></h3> <span class="info">info</span> </span> </li> </ul> </div> please see fiddle >>. i'm trying jquery.
i have tried this
$(".content-margin").delay(400).show("p", { direction: "left" }, 1200);
not working, how give slideleft effect p element, suggestion?
the headslide slider supports callbacks can use hide/slide "p" elements.
$('#headslide ul').cycle({ timeout: 4000, pager: '#headslide .pager', after: function(currslideelement, nextslideelement, options, forwardflag){ $(nextslideelement).find("p" ).hide(); $(nextslideelement).find("p" ).toggle("slide"); return false; } jfiddle:http://jsfiddle.net/bacec898/7/
reference: http://jquery.malsup.com/cycle/options.html
Comments
Post a Comment