简体   繁体   English

当页面动画到顶部以获得目标位置时,如何在单击..时获得窗口滚动单位

[英]How to get window scroll unit on click .. when a page is animating to top for target position

I need to do parallax scrolling on window scroll and also on navigation click.. In navigation click page is animating on top to show target. 我需要在窗口滚动和导航单击上进行视差滚动。在导航单击页面中,动画在顶部以显示目标。

How to get window scroll unit on click when page is animating to top for target position. 当页面动画到目标位置的顶部时,如何获得单击时的窗口滚动单位。

/*with this code i am trying to get window scroll unit */ / *使用此代码,我试图获取窗口滚动单元* /

$glob(document).ready(function() {
                $glob("#lookbook_navi a").bind("click",function(event){
                    event.preventDefault();
                    var target = $glob(this).attr("href");

                    var objWindow = $glob(window);

                    $window = $glob(window);
                    alert($window.scrollTop()); 

                    $glob("#page").animate({
                        "top": -($glob(target).position().top)
                    }, animSpeed);



                });
            });

/ With this code i am getting unit of window scrolling.. / / 通过此代码,我获得了窗口滚动的单位。

$glob(document).ready(function(){
                // Cache the Window object
                $window = $glob(window);

               $glob('div[data-type="lookBookTab"]').each(function(){
                    var $bgobj = $glob(this); // assigning the object

                    $glob(window).scroll(function() {

                        // Scroll the background at var speed
                        // the yPos is a negative value because we're scrolling it UP!                              
                        var yPos = -($window.scrollTop() / $bgobj.data('speed')); 

                        // Put together our final background position
                        var coords = '50% '+ yPos + 'px';

                        // Move the background
                        $bgobj.css({ backgroundPosition: coords });

                    }); // window scroll Ends
                }); 

Try this one 试试这个

$('a[href^="#"]').on('click',function (e) {
        e.preventDefault();
        var target = this.hash,
        $target = $(target);
        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 500, 'swing', function () {
            window.location.hash = target;
        });
    });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 动画元素onScroll时如何获得确切的滚动位置 - How to get exact scroll position when animating elements onScroll 单击时从窗口顶部滚动到特定位置 - Scroll to certain position from top of window on click 使用Angular-bootstrap模式和窗口位置时,如何防止页面滚动到顶部:已修复ipad的解决方法? - How to prevent page scroll to top when using Angular-bootstrap modal and window position:fixed workaround for ipad? 单击垂直选项卡时如何使页面滚动到顶部 - How to make page scroll to top when click the vertical tab 点击时无法滚动到页面顶部 - Can't get page to scroll to top on click 页面完全加载时的窗口滚动位置 - Window scroll position when the page is fully loaded 当我点击图片时如何让我的网站滚动到顶部 - How to get my website to scroll to the top when I click on an image 向下滚动jQuery时如何获取浏览器屏幕窗口的位置 - How to get the position of screen window of browser when scroll down jquery 当 window 不可滚动且滚动条被隐藏时,如何获取元素的滚动 position? - How to get scroll position of an element when window is not scrollable and scrollbar is hidden? 单击按钮时如何在reactjs中获取滚动位置 - How to get scroll Position in reactjs when click on button
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM