zoukankan      html  css  js  c++  java
  • 幻灯片,图片相册列表,淘宝商品放大镜 jquery实现

    1.图片相册切换 主要3个按钮功能

        点击小图列表切换大图

                $(document).on("click", ".photo_a", function () {
                    $(".photo_a").removeClass("cur").removeAttr("dota_mark");
                    $(this).addClass("cur").attr("dota_mark", "dota_cur");
                    $(".photo_block").children("img").hide().attr("src", $(this).children("img").attr("src")).fadeIn("slow");
                })

        点击下一页时,触发选择的小图的下一张小图的点击事件。默认显示7张,当是7的倍数也就是下一个隐藏列表就切换小图列表。
                $(document).on("click", ".photo_next", function () {
                    var c = parseInt($(".photo_a[dota_mark='dota_cur']").index('.photo_list a')) + 1;
                    if ($(".photo_a:eq(" + c + ")").length) {
                        $(".photo_a:eq(" + c + ")").click();
                        if (c % 7 == 0) {
                            var number = c / 7 * 707;
                            $(".photo_ul").animate({ left: -number }, 500);
                        }
                    }
                })

        同上
                $(document).on("click", ".photo_prev", function () {
                    var c = parseInt($(".photo_a[dota_mark='dota_cur']").index('.photo_list a')) - 1;
                    if (c >= 0) {
                        $(".photo_a:eq(" + c + ")").click();
                        if ((c - 6) % 7 == 0) {
                            var number = (c + 1) / 7 * 707 - 707;
                            $(".photo_ul").animate({ left: -number }, 500);
                        }
                    }
                })

  • 相关阅读:
    HDU 1075 What Are You Talking About(字典树)
    HDU 1075 What Are You Talking About (stl之map映射)
    HDU 1247 Hat’s Words(字典树活用)
    字典树HihoCoder
    HDU 1277全文检索(字典树)
    HDU 3294 Girls' research(manachar模板题)
    HDU 3294 Girls' research(manachar模板题)
    HDU 4763 Theme Section(KMP灵活应用)
    Ordering Tasks UVA
    Abbott's Revenge UVA
  • 原文地址:https://www.cnblogs.com/RedRoshan/p/3663436.html
Copyright © 2011-2022 走看看