分离两个脚本“滚动到div”

时间:2015-05-27 11:18:22

标签: javascript jquery html css

我自己试图这样做,但我想我不够熟练,我放弃尝试并前来寻求帮助。 我在一个单页的网站上为我的菜单编写了这个脚本。

 $(document).ready(function () {
        $(document).on("scroll", onScroll);

        //MENU
        $('.menu ul li a[href^="#"]').on('click', function (e) {
            e.preventDefault();
            $(document).off("scroll");

            $('a').each(function () {
                $(this).attr('id', '');
            })
            $(this).attr('id', 'active');

            var target = this.hash;
            $target = $(target);
            $('html, body').stop().animate({
                'scrollTop': $target.offset().top+2
            }, 1000, 'swing', function () {
                window.location.hash = target;
                $(document).on("scroll", onScroll);
            });
        });            
    });

    function onScroll(event){
        var scrollPosition = $(document).scrollTop();
        $('a').each(function () {
            var currentLink = $(this);
            var refElement = $(currentLink.attr("href"));
            if (refElement.position().top <= scrollPosition && refElement.position().top + refElement.height() > scrollPosition) {
                $('.menu ul li a').attr("id", "");
                currentLink.attr("id", "active");
            }
            else{
                currentLink.attr("id", "");
            }
        });
    }

它完全符合我的要求,但我的网站也有链接,我希望他们也这样做。

我自己做了,但是两个脚本相互合并,它也将class active应用于链接。当我试图改变这种情况时,它正在运行,但它没有在菜单上应用class active ......

我真的很困惑,我也不是一个js / jquery程序员。

有人可以就如何分离脚本提出建议吗?例如:<a href="#contactos" class="solicitar_visita"><span>SOLICITE A NOSSA VISITA</span></a>。这会将用户发送到div contactos,但它没有动画,我希望它能够这样做。

有什么想法吗?

编辑:对于第二个脚本,我不想应用任何active class。只需滑动到所需的div

编辑2:我相信我不清楚。我想要这样的东西

$(document).ready(function () {
            $(document).on("scroll", onScroll);

            //MENU
            $('.menu ul li a[href^="#"]').on('click', function (e) {
                e.preventDefault();
                $(document).off("scroll");

                $('a').each(function () {
                    $(this).attr('id', '');
                })
                $(this).attr('id', 'active');

                var target = this.hash;
                $target = $(target);
                $('html, body').stop().animate({
                    'scrollTop': $target.offset().top+2
                }, 1000, 'swing', function () {
                    window.location.hash = target;
                    $(document).on("scroll", onScroll);
                });
            });

            //OTHER LINKS
            $('a[href^="#"]').on('click', function (e) {
                e.preventDefault();
                $(document).off("scroll");

                var target = this.hash;
                $target = $(target);
                $('html, body').stop().animate({
                    'scrollTop': $target.offset().top+2
                }, 1000, 'swing', function () {
                    window.location.hash = target;
                    $(document).on("scroll", onScroll);
                });
            });            
        });

    function onScroll(event){
        var scrollPosition = $(document).scrollTop();
        $('a').each(function () {
            var currentLink = $(this);
            var refElement = $(currentLink.attr("href"));
            if (refElement.position().top <= scrollPosition && refElement.position().top + refElement.height() > scrollPosition) {
                $('.menu ul li a').attr("id", "");
                currentLink.attr("id", "active");
            }
            else{
                currentLink.attr("id", "");
            }
        });
    }

但“OTHER LINKS”脚本会干扰菜单脚本。我不知道我做得对不对,我所知道的是我做的方式,它不起作用。

1 个答案:

答案 0 :(得分:0)

您可以使用 addClass removeClass 代替attr。

UPDATE my_table SET timestamp [countOfArray] = newDate;