code blogspot trở về đầu trang

Hiệu ứng trở về đầu trang - scroll Top jquery đơn giản Hiệu ứng scroll top ta thường thấy xuất hiện ở 1 số trang web có nội dung dài -khiến ...

Hiệu ứng trở về đầu trang - scroll Top jquery đơn giản
Hiệu ứng scroll top ta thường thấy xuất hiện ở 1 số trang web có nội dung dài -khiến người lướt web phải lăn mouse 3 hay dùng trỏ chuột kéo thanh scroll bar rất bất tiện .

Hôm nay KHÁM PHÁ BLOGSPOT chia sẻ một code blogspot rất hay, và chạy nhẹ nhàng uyển chuyển tới các bạn

Khi sử dụng hiệu ứng jquery scroll top sẽ giúp người dùng trở về ngay đầu trang - tránh làm mất thời gian - nút bấm scroll top sẽ xuất hiện thi nội dung trang web được
1- Thêm phần script
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<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 }, 'slow');
            return false;
        });

    });
</script>

2- Thêm phần style của nút lên
<style>
    .scrollup{
    width:40px;
    height:40px;
    opacity:1;
    position:fixed;
    bottom:20px;
    right:10px;
    display:none;
    text-indent:-9999px;
    background:#333333 url('http://icons.iconarchive.com/icons/troyboydesign/delightful-zodiac/128/Snake-icon.png') no-repeat;
}
</style>

các bạn có thể thay bằng hình ảnh khác cho phù hợp với trang web http://icons.iconarchive.com/icons/troyboydesign/delightful-zodiac/128/Snake-icon.png
3- Giờ để xuất hiện cái nút đi lên đó bạn hãy đặt trong thẻ body để tiện bạn có thể đặt trước
<a href="#" class="scrollup">Scroll</a>
</body>

COMMENTS

BLOGGER
Tên

AIO Android Apps Android Blogger Crack-Patch Drivers Đời sống Game Mobile Offline Game Mobile Online Games Android Ghost HANDMADE hot Internet Máy Tính Bảng Mẹo vặt MMO Mod Android Mutilmedia Phần mềm Phần Mền Relax SEO Smartphone SMS Kute Software Templates Thiết Bị Số Thủ thuật Thủ thuật nhiếp ảnh Tiện ích Tin Công Nghệ Tin mới Tip Lumia Tips Tips Android Tools Văn Học 10 Widgets Win 7 Win 8 Win XP Windows Windows Phone
false
ltr
item
VNICT.NET: code blogspot trở về đầu trang
code blogspot trở về đầu trang
http://1.bp.blogspot.com/-ap6CHsPf-W8/UkWuwFPjOsI/AAAAAAAAADI/ye6cbmPc44Q/s320/scrolltotop.jpg
http://1.bp.blogspot.com/-ap6CHsPf-W8/UkWuwFPjOsI/AAAAAAAAADI/ye6cbmPc44Q/s72-c/scrolltotop.jpg
VNICT.NET
http://www.vnict.net/2013/09/code-blogspot-tro-ve-au-trang_27.html
http://www.vnict.net/
http://www.vnict.net/
http://www.vnict.net/2013/09/code-blogspot-tro-ve-au-trang_27.html
true
2882541057390150517
UTF-8
Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy