jquery 및 css3(코드)를 사용하여 탐색 모음을 하단으로 이동하는 방법

이번 글에서 공유한 내용은 jquery와 css3(코드)를 이용하여 네비게이션 바를 하단으로 이동시키는 방법에 대한 내용입니다. 다음으로 구체적인 내용을 살펴보도록 하겠습니다. 도움이 필요한 친구를 도와주세요.

탐색 모음

.navigation {
    position: fixed;
    bottom: 100px;
    right: 100px;
    z-index: 100;
}.navigation {
    transition: bottom 2s;
    -webkit-transition: bottom 2s;
}

JQ 코드

var nav = eval($('.navigation').offset().top - $(window).scrollTop());
$(window).on('scroll', function() {
    var navh = $('.navigation').height();
    var foot = parseInt($('.footer').offset().top - $(this).scrollTop() - navh);
    /*console.log(nav - foot);*/
    if(nav == foot || nav > foot) {
        $('.navigation').css({
            'position': 'fixed',
            'bottom': '400px'
        });
    } else {
        $('.navigation').css({
            'position': 'fixed',
            'bottom': '100px'
        });
    }
});

관련 권장 사항:

Css Sprite가 이미지 스티칭 기술을 구현하는 방법

Css 및 js 모바일 터미널을 사용하여 각각 휴대폰의 가로 및 세로 화면 상태를 확인하는 방법

위 내용은 jquery 및 css3(코드)를 사용하여 탐색 모음을 하단으로 이동하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!