"Thủ thuật tạo hiệu ứng nội dung cuộn khi rê chuột"

(Traidatmui.com) – Hôm nay mình xin chia sẻ đến các bạn một thủ thuật với hiệu ứng Sroller cho một nội dung nào đó. Thông thường đối với những nội dung dài thì để nó không chiếm nhiều không gian trên blog bạn, chúng ta có thể cho chúng nằm trong một khung và dùng hiệu ứng cuộn trang. Thủ thuật này cũng ứng dụng hiệu ứng này tuy nhiên nó có một điểm khác biệt nhỏ. Đối với cửa sổ cuộn thì bạn thường lăn chuột để xem nội dung kế tiếp, còn với thủ thuật này bạn không phải cuộn chuột, thay vào đó bạn chỉ việc rê chuột vào biểu tượng lên, xuống thì bạn có thể xem được những nội dung kế tiếp. Bạn xem demo bên dưới.

1. Đầu tiên bạn đăng nhập vào tài khoản blogspot
2. Vào thiết kế và chọn thêm tiện ích
3. Chọn thêm 1 HTML/Javasript và thêm code bên dưới vào phần tử HTML vừa thêm
<script type="text/javascript">
iens6=document.all||document.getElementById
ns4=document.layers

var speed=5 //tốc độ scroll
if (iens6){
document.write('<div id="container" style="background:#000099; position:relative; width:350px; height:180px; color:#fff; border:1px solid #aaa; overflow:hidden;">')
document.write('<div id="content" style="padding:5px; position:absolute; width:98%; left:0; top:0">')
}

</script>
<ilayer name="nscontainer">
<layer name="nscontent">

Nội dung chứa trong khung scroll

</layer>
</ilayer>

<script language="JavaScript1.2">
if (iens6)
document.write('</div></div>')</script>

<span style="margin-left:140px;"><a href="#moveup()" onmouseover="moveup()" onmouseout="clearTimeout(moveupvar)"><img alt="Lên trên" src="http://lh6.ggpht.com/_BTztXRwC9ik/TJ3Mtahr6EI/AAAAAAAAD6s/LrDTcrRQnrY/up.gif" border="0" /></a>
<a href="#movedown()" onmouseover="movedown()" onmouseout="clearTimeout(movedownvar)"><img alt="Xuống dưới" src="http://lh5.ggpht.com/_BTztXRwC9ik/TJ3MtLS7RfI/AAAAAAAAD6o/EZ4_nxWeVVg/down.gif" border="0" /></a></span>

<script src="http://data-traidatmui.appspot.com/scripts/scroller_content.js" type="text/javascript"/></script>

Chỉnh sửa code:
- Code màu đỏ chính là độ rộng (width) và chiều cao (height) của khung nội dung
- Bạn dựa vào code màu xanh để chỉnh sửa màu chữ, màu nền, màu đường viền lại cho phù hợp với blog bạn.
- Dòng màu đỏ đậm là nơi chứa nội dung bạn muốn cho nó cuộn, bạn thay thành nội dung của bạn.
4. Save phần tử lại là xong

Chúc bạn thành công

Xem khác cùng chủ đề

3 nhận xét | Viết lời bình

10/08/2010 12:12:00 SA Trả lời

ban oi toi co y kien the nay ,da la 1 bloger thi ta nen chia se tat ca nhung gi minh co the , chu dau can phai dung de kinh doanh dau dung ko , tui thi cui bap lam nhung ko can kinh doanh , minh viet blog chu yeu de thu gian , chung ta con nhieu viec phai lam de kiem song lam ,toi thay ban dang muc <chu ki tu dong do, roi de so dien thoai lai, la hoi bi ki , neu ban ko kinh doanh thi nen chia se cho nhung nguoi, moi den thi ho cam kich nhieu ,ban nghi dung ko ? ,toi mong nhan thu cua ban, neu toi noi sai ,con dung thi thoi cung duoc,

Admin
10/08/2010 06:57:00 SA Trả lời

Điều bạn nói không sai nhưng chỉ đúng một phần thôi bạn ah. Bạn chỉ nói đúng việc "tạo blog để chia sẻ với mọi người" tôi hoàn toàn đồng ý, còn phần tạo blog mà không kiếm tiền thì điều đó tôi không đồng ý.

Hiện nay có rất nhiều blog kiếm được thu nhập từ việc này đấy bạn ah. Nếu không có mục đích kiếm tiền thì không có những bài viết giúp bạn có những cách hay kiếm tiền từ blog của bạn đâu.

Vâng tôi tạo blog là mục đích chia sẻ thông tin, nhưng việc làm sao để blog có thể phục vụ tốt và duy trì được thì cũng cần đầu tư nhiều thứ lắm bạn ah. Mình chỉ muốn trang trãi một phần chi phí để duy trì được blog lâu dài và hoạt động tốt để có thể đưa những thông tin bổ ích đến với các bạn. Xin giải thích bạn rỏ.

Thân!

11/26/2010 05:33:00 SA Trả lời

thật ra tạo ra 1 cái blog và tốn thời gian chia sẻ những kinh nghiệm với mọi người qua những bài post bài hướng dẫn như vầy quả thật tốn nhiều thời gian và tâm huyết rồi .cho dù có kinh doanh thì cũng được mà . cảm ơn traidatmui.com nhiều .

Bạn nhập từ: cungly Bạn nhập từ: lleu Bạn nhập từ: kkrong Bạn nhập từ: cuoilon Bạn nhập từ: roile Bạn nhập từ: hehehe Bạn nhập từ: byebye Bạn nhập từ: idontknow Bạn nhập từ: votay more »

Giải pháp bán hàng online Số 1 Việt Nam
Lên đầu trang Xuống cuối trang