Jump to content
  • Кнопка вверх без плагинов


    Открываем наш стиль, в самый низ в globalTemplate ставим этот код:

    <a href="#" class="scrollup">Наверх</a>

    Это в custom css:

    .scrollup{
    width:40px;
    height:40px;
    opacity:0.3;
    position:fixed;
    bottom:50px;
    right:100px;
    display:none;
    text-indent:-9999px;
    background: url('icon_top.png') no-repeat;
    }

    При помощи этого кода кроме внешнего вида мы определяем позицию кнопки и задаем отступы 100 px с права и  50 px снизу.

    Теперь подключаем библиотеку, если она еще не подключена для вашего сайта. Для этого между тегами <head>...</head>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    Затем сразу после подключения библиотеки необходимо в globalTemplate расположить следующий  код JQuery:

    <script type="text/javascript">
    $(document).ready(function(){
     
    $(window).scroll(function(){
    if ($(this).scrollTop() > 100) {
    $('.scrollup').fadeIn();
    } else {
    $('.scrollup').fadeOut();
    }
    });
     
    $('.scrollup').click(function(){
    $("html, body").animate({ scrollTop: 0 }, 600);
    return false;
    });
     
    });
    </script>

    И так же Вам понадобится изображение самой стрелки:

    icon_top.png.e9730ab8cabac0d793c9c7dc422c77af.png


    User Feedback

    Recommended Comments

    There are no comments to display.



    Join the conversation

    You can post now and register later. If you have an account, sign in now to post with your account.
    Note: Your post will require moderator approval before it will be visible.

    Guest
    Add a comment...

    ×   Pasted as rich text.   Paste as plain text instead

      Only 75 emoji are allowed.

    ×   Ваша ссылка была автоматически строена.   Отображать как обычную ссылку

    ×   Your previous content has been restored.   Clear editor

    ×   You cannot paste images directly. Upload or insert images from URL.

    Loading...

×
×
  • Create New...