html

当前位置:首页 > 前端 > html

相册点击弹出当前相册的多图进行切换

<!-- 相册列表页 --> <ul class="xypg-album-list clearfix"> <!--{foreach $album as $volist}--> <li data-id="<!--{$volist.id}--...
<!-- 相册列表页 -->
<ul class="xypg-album-list clearfix">
  <!--{foreach $album as $volist}-->
    <li data-id="<!--{$volist.id}-->">
        <a href="#" title="<!--{$volist.title}-->" class="img">
            <img src="<!--{$app->content->thumb($volist.uploadfiles,800,800)}-->" alt="<!--{$volist.title}-->" />
        </a>
        <h3><!--{$volist.title|truncate:20}--></h3>
        
        <div class="tan-show hidden">
            <ul class="nex-list">
                <!--{foreach $volist.uploadfiles as $key=> $volist2}-->
                <li>
                    <a href="<!--{$volist2}-->" title="<!--{$volist2}-->" class="img" data-fancybox="group<!--{$volist.id}-->">
                        <img src="<!--{$volist2}-->" alt="<!--{$volist2}-->" />
                    </a>
                </li>
                 <!--{/foreach}-->
            </ul>
        </div>
        
    </li>
  <!--{/foreach}-->
</ul>


<script>
    $(document).ready(function() {
        $('.xypg-album-list > li > a').click(function(event) {
            event.preventDefault(); // 阻止事件的默认行为的方法
            var $nexListAnchor = $(this).siblings('.tan-show').find('.nex-list > li > a:first'); // 选择所有和当前元素同级(同一个父级)并且具有 .tan-show 类的元素
            if ($nexListAnchor.length) {
                $nexListAnchor[0].click();  // 模拟触发该元素的点击事件
            }
        });
    });
</script>


上一篇:扇形切换

下一篇:已经是最后一篇

相关内容

文章评论

表情

共 0 条评论,查看全部
  • 这篇文章还没有收到评论,赶紧来抢沙发吧~