[Codes] Nút lên đầu trang đơn giản

[Lùn Lì Lợm]

vào vấn đề lun nha
Demo :

Hoặc vào link
http://cso2.forumvi.com/
Codes :
chèn codes sau vào css

Code:

#backtotop {
width:100px;
background:#F4FFBF;
border:1px solid #ccc;
text-align:center;
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
color:#666;
text-decoration:none;
}

Chèn vào sau thẻ trong header

Code:


<a href="#" id="backtotop">Lên đầu trang</a>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>

<script type='text/javascript'>

$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});



$(function() {

$("#toTop").scrollToTop();

});

</script>


My toàn đi rip ở forum vbb đã test

[miamor]

1. Nếu đã dùng script thì thà dùng cái nút lên xuống mà khi lên top r` nó ẩn đi ấy. Mà cái nút này share ở cp rồi.
Đoạn code đó đây thì phải: (Cái này hình như không chính xác y chang bản gốc nhưng chắc k sao... )

Code:

<script type='text/javascript'>var maxheight = $(document).height();$(function(){$.fn.scrollToMiddle=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="maxheight/2"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="maxheight/2"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:maxheight/2},"slow")})}});$(function(){$.fn.scrollToBottom=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="maxheight"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="maxheight"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:maxheight},"slow")})}});$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});$(function() {$("#toMiddle").scrollToMiddle();$("#toTop").scrollToTop();$("#toBottom").scrollToBottom();});</script><div style="bottom: 25px;clip: inherit;position: fixed;right: 5px;">

<a href="#" id="toTop"><span onmouseover="showtip('Click để về đầu trang');" onmouseout="hidetip();"><img alt="Đầu trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/top10110.png"></span></a><br>

<a href="#" id="toMiddle"><span onmouseover="showtip('Click để về giữa trang');" onmouseout="hidetip();"><img alt="Giữa trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/middle10.png"></span></a><br>

<a href="#" id="toBottom"><span onmouseover="showtip('Click để về cuối trang');" onmouseout="hidetip();"><img alt="Cuối trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/bottom10.png"></span></a></div>

2. Nếu đã không muốn nặng rum thì tốt nhất bỏ hết script đi. Một đoạn script ngắn + link #top, #bottom là xong

[Lùn Lì Lợm]

My gà mà ? dù sao cũng là tinh thần share mà ? haizz ai dùng thì dùng thôi . k qtrọng

[miamor]

My gà mà ? dù sao cũng là tinh thần share mà ? haizz ai dùng thì dùng thôi . k qtrọng

Cứ thích xuyên tạc linh tinh. Chỉ là góp ý thôi. Nếu k thích thì từ h topic nào của bạn mình cũg vào khen hết...

[handsomevip007]

Tinh thần chia sẻ thì hoan nghênh Nhưng thử suy nghĩ những cái gì khác để làm xem Nhìn tới nhìn lui cũng chỉ có mấy loại code này Có ai phát triển thêm đi. Không chỉ di chuyển lên xuống mà di chuyển tới đâu thì hiện bảng hướng dẫn sử dụng tới đó đi

[Jack.Nguyễn]

1. Nếu đã dùng script thì thà dùng cái nút lên xuống mà khi lên top r` nó ẩn đi ấy. Mà cái nút này share ở cp rồi.
Đoạn code đó đây thì phải: (Cái này hình như không chính xác y chang bản gốc nhưng chắc k sao... )

Code:

<script type='text/javascript'>var maxheight = $(document).height();$(function(){$.fn.scrollToMiddle=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="maxheight/2"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="maxheight/2"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:maxheight/2},"slow")})}});$(function(){$.fn.scrollToBottom=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="maxheight"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="maxheight"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:maxheight},"slow")})}});$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});$(function() {$("#toMiddle").scrollToMiddle();$("#toTop").scrollToTop();$("#toBottom").scrollToBottom();});</script><div style="bottom: 25px;clip: inherit;position: fixed;right: 5px;">

<a href="#" id="toTop"><span onmouseover="showtip('Click để về đầu trang');" onmouseout="hidetip();"><img alt="Đầu trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/top10110.png"></span></a><br>

<a href="#" id="toMiddle"><span onmouseover="showtip('Click để về giữa trang');" onmouseout="hidetip();"><img alt="Giữa trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/middle10.png"></span></a><br>

<a href="#" id="toBottom"><span onmouseover="showtip('Click để về cuối trang');" onmouseout="hidetip();"><img alt="Cuối trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/bottom10.png"></span></a></div>

2. Nếu đã không muốn nặng rum thì tốt nhất bỏ hết script đi. Một đoạn script ngắn + link #top, #bottom là xong

Chỉ em làm cái này đi anh

[miamor]

@Jack.Nguyễn: là sao bạn?! Bạn muốn làm cái 1. hay cái 2.?
Nếu làm cái 1. thì code đó rồi. Nhét vào footer thôi .
Còn làm cái 2. thì nhét cái này vào footer:

Code:

<div style="bottom: 25px;clip: inherit;position: fixed;right: 5px;">
<a href="#top"><span onmouseover="showtip('Click để về đầu trang');" onmouseout="hidetip();"><img alt="Đầu trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/top10110.png"></span></a><br>
<a href="#bottom"><span onmouseover="showtip('Click để về cuối trang');" onmouseout="hidetip();"><img alt="Cuối trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/bottom10.png"></span></a></div>

P/s: Đừng gọi là a nhé!

[nightWalker]

Hoan ngênh My đã có công share, mỗi cái đều đóng góp cho thêm 1 code, tut, html,... mới mà thôi, không quan trọng hot hay không hot. Thanks phát cho khí thế nhé em.
P/s: Chị miamor làm cái đơn xin đổi tên chứ để thể dễ hỉu lầm

[Jack.Nguyễn]

@Jack.Nguyễn: là sao bạn?! Bạn muốn làm cái 1. hay cái 2.?
Nếu làm cái 1. thì code đó rồi. Nhét vào footer thôi .
Còn làm cái 2. thì nhét cái này vào footer:

Code:

<div style="bottom: 25px;clip: inherit;position: fixed;right: 5px;">
<a href="#top"><span onmouseover="showtip('Click để về đầu trang');" onmouseout="hidetip();"><img alt="Đầu trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/top10110.png"></span></a><br>
<a href="#bottom"><span onmouseover="showtip('Click để về cuối trang');" onmouseout="hidetip();"><img alt="Cuối trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/bottom10.png"></span></a></div>

P/s: Đừng gọi là a nhé!

Vậy chỉ cho mình làm sao cho nó di chuyển mượt hơn được không??

[miamor]

@Jack.Nguyễn: là sao bạn?! Bạn muốn làm cái 1. hay cái 2.?
Nếu làm cái 1. thì code đó rồi. Nhét vào footer thôi .
Còn làm cái 2. thì nhét cái này vào footer:

Code:

<div style="bottom: 25px;clip: inherit;position: fixed;right: 5px;">
<a href="#top"><span onmouseover="showtip('Click để về đầu trang');" onmouseout="hidetip();"><img alt="Đầu trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/top10110.png"></span></a><br>
<a href="#bottom"><span onmouseover="showtip('Click để về cuối trang');" onmouseout="hidetip();"><img alt="Cuối trang" border="0" src="http://i34.servimg.com/u/f34/15/44/78/93/bottom10.png"></span></a></div>

P/s: Đừng gọi là a nhé!

Vậy chỉ cho mình làm sao cho nó di chuyển mượt hơn được không??

Bạn muốn cái 1. hay cái 2. di chuyển mượt hơn?? Cái 1. mình thấy thế là đủ mượt r` Còn nếu muốn cái 2. mượt hơn thì.... tịt Cái 2. k có script nên chỉ được có thế thôi

Hoan ngênh My đã có công share, mỗi cái đều đóng góp cho thêm 1 code, tut, html,... mới mà thôi, không quan trọng hot hay không hot. Thanks phát cho khí thế nhé em.
P/s: Chị miamor làm cái đơn xin đổi tên chứ để thể dễ hỉu lầm

Cái tên này nó men lỳ lắm à......?!!

[Lùn Lì Lợm]

uh. my sai
thông cảm
tại ít dzô
sẽ cố gắng phát triển codes mặc dù chưa biết gì
my đang đi ríp 1 vài codes tốt hơn

[miamor]

uh. my sai
thông cảm
tại ít dzô
sẽ cố gắng phát triển codes mặc dù rất ngu
my đang đi ríp 1 vài codes tốt hơn

Chẳng ai nói bạn ngu cả
Đừng nói những lời cay độc thế. Bạn nói vậy như thể mình là kẻ xấu k bằng (Mình có xấu k )

uh. my sai

Tụi này k bắt bạn nói ra những lời nói như thế này đâu....!

[rola fadi]

thanks

[Sponsored content]