Scroll to Top jQuery button for Blogger

Ingin menambahkan Scroll gaya untuk Plugin Top ke WordPress? Jika Ya. Berikut adalah beberapa langkah sederhana untuk melakukannya. Widget tidak menggunakan gambar dan tombol terbuat dari CSS. Efek bergulir di plugin ini disebabkan oleh jQuery menambahkan.

Tombol tidak akan muncul ketika scroll bar adalah di atas yaitu halaman tidak menggulir. Sebagai salah satu gulungan tombol akan muncul di kanan bawah. Di bawah ini adalah prosedur untuk menambahkan tombol untuk blog Blogger Anda.

Edit HTML dan menambahkan kode

Klik pada pilihan Edit HTML di Blogger dan mencari </ body> tag dalam template Anda dengan menekan Ctrl + F. Tambahkan kode di bawah ini diberikan tepat di atas </ body> dan simpan template. Thats it.

<style type="text/css">
#abt-Top {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=&#39;#99EEEEEE&#39;,EndColorStr=&#39;#99EEEEEE&#39;);text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"/>
<script type='text/javascript'>
    jQuery(function($) {
        $.fn.scrollToTop = function() {
        $(this).hide().removeAttr(&quot;href&quot;);
        if ($(window).scrollTop() != &quot;0&quot;) {
            $(this).fadeIn(&quot;slow&quot;)
        }
        var scrollDiv = $(this);
        $(window).scroll(function() {
        if ($(window).scrollTop() == &quot;0&quot;) {
        $(scrollDiv).fadeOut(&quot;slow&quot;)
        } else {
        $(scrollDiv).fadeIn(&quot;slow&quot;)
        }
    });
    $(this).click(function() {
        $(&quot;html, body&quot;).animate({
        scrollTop: 0
        }, &quot;slow&quot;)
    })
    }
});
jQuery(function($) {
    $(&quot;#abt-Top&quot;).scrollToTop();
});
</script>
    <a href="#" id="abt-Top" style="display: none;">Scroll to Top </a>

Anda dapat menyesuaikan CSS agar sesuai kebutuhan Anda. Anda dapat mengganti tombol CSS dengan gambar dengan mengubah latar belakang CSS dengan URL dari gambar yang menggunakan tag background: url ()

Your Scroll to top button is ready.
 

• Tweet
• Share
• Share
• Share
• Share

About Admin MC3

This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.

Related Post