首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何用jquery从右向左滑动元素

如何用jquery从右向左滑动元素
EN

Stack Overflow用户
提问于 2015-06-03 03:51:52
回答 1查看 58关注 0票数 0

试图通过jquery将p从右向左滑动到这个滑块。此滑块在默认情况下具有淡出效果,我尝试将slideLeft效果给予滑块的p描述,而不是整个滑块元素。

HTML:

代码语言:javascript
复制
<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 his 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 with a pixel-perfect eye</a></h3>
                <span class="info">Info</span>
            </span>
        </li>
    </ul>
</div>

请看这个小提琴 >>。我正试图通过jquery来完成这个任务。

我试过这个

$(".content-margin").delay(400).show("p", { direction: "left" }, 1200);

不工作,如何使slideLeft效应只给p元素,有什么建议吗?

EN

回答 1

Stack Overflow用户

发布于 2015-06-03 04:23:15

头滑滑块支持回调,可以用来隐藏/滑动"p“元素。

代码语言:javascript
复制
$('#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; 
}

小提琴:http://jsfiddle.net/bacec898/7/

参考资料:http://jquery.malsup.com/cycle/options.html

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30610540

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档