NoobSlide - mootools - 19 November 2010 - All 4 You
Friday, 24-Feb-2017, 4:56 PM
Welcome Guest | RSS
Main » 2010 » November » 19 » NoobSlide - mootools
12:08 PM
NoobSlide - mootools
XEM DEMO

Code

<link rel="stylesheet" href="http://www.efectorelativo.net/laboratory/noobSlide/_web.css" type="text/css" media="screen" /> 

<link rel="stylesheet" href="http://all4u.dmon.com/CSS/style5.css" type="text/css" media="screen" /> 

<script type="text/javascript" src="http://all4u.dmon.com/Php/gzip.phpjsmootools-1.2-core.js"></script> 

<script type="text/javascript" src="http://all4u.dmon.com/Js/class.noobSlide.packed.js"></script> 

<script type="text/javascript" src="http://all4u.dmon.com/Js/noobSlide-mootools.js"></script>


Nếu bạn thích kiểu hiển thị nào thì copy đoạn code của các kiểu hiển thị dưới đây, paste xuống dưới đoạn code ở trên nhé.

Code kiểu 1

<link rel="stylesheet" href="http://www.efectorelativo.net/laboratory/noobSlide/_web.css" type="text/css" media="screen" /> 

<link rel="stylesheet" href="http://all4u.dmon.com/CSS/style5.css" type="text/css" media="screen" /> 

<script type="text/javascript" src="http://all4u.dmon.com/Php/gzip.phpjsmootools-1.2-core.js"></script> 

<script type="text/javascript" src="http://all4u.dmon.com/Js/class.noobSlide.packed.js"></script> 

<script type="text/javascript" src="http://all4u.dmon.com/Js/noobSlide-mootools.js"></script>

<div class="mask1"> 

<div id="box1"> 

<span><img src="1.jpg" width=240 alt="Photo" /></span> 

<span><img src="2.jpg" width=240 alt="Photo" /></span> 

<span><img src="3.jpg" width=240 alt="Photo" /></span> 

<span><img src="4.jpg" width=240 alt="Photo" /></span> 

<span><img src="5.jpg" width=240 alt="Photo" /></span> 

<span><img src="6.jpg" width=240 alt="Photo" /></span>

<span><img src="7.jpg" width=240 alt="Photo" /></span> 

<span><img src="8.jpg" width=240 alt="Photo" /></span>

</div> </div> 


Code kiểu 2

<div class="mask2">

<div id="box2"> <span><img src="img1.jpg" alt="Photo" /></span> <span><img src="img2.jpg" alt="Photo" /></span> <span><img src="img3.jpg" alt="Photo" /></span> <span><img src="img4.jpg" alt="Photo" /></span> <span><img src="img5.jpg" alt="Photo" /></span> <span><img src="img6.jpg" alt="Photo" /></span> <span><img src="img7.jpg" alt="Photo" /></span> <span><img src="img8.jpg" alt="Photo" /></span> </div> </div> <p class="buttons"> <span id="prev1">&lt;&lt; Previous</span> <span id="play1">Play &gt;</span> <span id="stop1">Stop</span> <span id="next1">Next &gt;&gt;</span> </p>


Code kiểu 3

<div class="mask2">

<div id="box3"> <span><img src="img1.jpg" alt="Photo" /></span> <span><img src="img2.jpg" alt="Photo" /></span> <span><img src="img3.jpg" alt="Photo" /></span> <span><img src="img4.jpg" alt="Photo" /></span> <span><img src="img5.jpg" alt="Photo" /></span> <span><img src="img6.jpg" alt="Photo" /></span> <span><img src="img7.jpg" alt="Photo" /></span> <span><img src="img8.jpg" alt="Photo" /></span> </div> </div> <p class="buttons"> <span id="playback3">&lt; Playback</span> <span id="stop3">Stop</span> <span id="play3">Play &gt;</span> </p>


Code kiểu 4

<div class="mask3"> 
<div id="box4"> 
<div> <h3>Title 1</h3> <img src="1.jpg" alt="Photo" /> <p>ND 1</p> </div> 
<div> <h3>Title 2</h3> <img src="2.jpg" alt="Photo" /> <p>ND 2</p> </div> 
<div> <h3>Title 3</h3> <img src="3.jpg" alt="Photo" /> <p>ND 3</p> </div> 
<div> <h3>Title 4</h3> <img src="4.jpg" alt="Photo" /> <p>ND 4</p> </div> 
<div> <h3>Title 5</h3> <img src="5.jpg" alt="Photo" /> <p>ND 5</p> </div> 
<div> <h3>Title 6</h3> <img src="6.jpg" alt="Photo" /> <p>ND 6</p> </div> 
<div> <h3>Title 7</h3> <img src="7.jpg" alt="Photo" /> <p>ND 7</p> </div> 
<div> <h3>Title 8</h3> <img src="8.jpg" alt="Photo" /> <p>ND 8</p> </div> 
 
</div> </div> 
<h4>Show: <span id="info4"></span></h4> 
<p class="buttons" id="handles4"> 
<span>Title rút gọn 1</span> 
<span>Title rút gọn 2</span> 
<span>Title rút gọn 3</span> 
<span>Title rút gọn 4</span> 
<span>Title rút gọn 5</span> 
<span>Title rút gọn 6</span> 
<span>Title rút gọn 7</span> 
<span>Title rút gọn 8</span> 
</p> 


Code kiểu 5

<div class="mask2"> 

<div id="box5">

<span><img src="img1.jpg" alt="Photo" /></span> 

<span><img src="img2.jpg" alt="Photo" /></span> 

<span><img src="img3.jpg" alt="Photo" /></span> 

<span><img src="img4.jpg" alt="Photo" /></span> 

<span><img src="img5.jpg" alt="Photo" /></span> 

<span><img src="img6.jpg" alt="Photo" /></span> 

<span><img src="img7.jpg" alt="Photo" /></span> 

<span><img src="img8.jpg" alt="Photo" /></span> 

</div>

<div id="info5" class="info"></div>

</div>

<p class="buttons">

<span id="prev5">&lt;&lt; Previous</span>

<span id="play5">Play &gt;</span>

<span id="stop5">Stop</span>

<span id="next5">Next &gt;&gt;</span>

</p>


Code kiểu 6

<div class="thumbs" id="handles6_1"> 

<div><img src="img1.jpg" alt="Photo Thumb" /></div> 

<div><img src="img2.jpg" alt="Photo Thumb" /></div> 

<div><img src="img3.jpg" alt="Photo Thumb" /></div> 

<div><img src="img4.jpg" alt="Photo Thumb" /></div> 

</div> 

<div class="mask6"> 

<div id="box6"> 

<span><img src="img1.jpg" alt="Photo" /></span> 

<span><img src="img2.jpg" alt="Photo" /></span> 

<span><img src="img3.jpg" alt="Photo" /></span> 

<span><img src="img4.jpg" alt="Photo" /></span> 

<span><img src="img5.jpg" alt="Photo" /></span> 

<span><img src="img6.jpg" alt="Photo" /></span> 

<span><img src="img7.jpg" alt="Photo" /></span> 

<span><img src="img8.jpg" alt="Photo" /></span> 

</div> 

<div class="info"></div> 

</div> 

<div class="thumbs" id="handles6_2"> 

<div><img src="img5.jpg" alt="Photo Thumb" /></div> 

<div><img src="img6.jpg" alt="Photo Thumb" /></div> 

<div><img src="img7.jpg" alt="Photo Thumb" /></div> 

<div><img src="img8.jpg" alt="Photo Thumb" /></div> 

</div> 

<p class="buttons"> 

<span id="prev6">&lt;&lt; Previous</span> 

<span id="playback6">&lt;Playback</span> 

<span id="stop6">Stop</span> 

<span id="play6">Play &gt;</span> 

<span id="next6">Next &gt;&gt;</span> 

</p> 



Chú ý:
Category: Featured Post - Image Gallery | Views: 1384 | Added by: all4u | Rating: 0.0/0
Total comments: 4
4  
Also, the image that I am using is a PNG. Would that affect the code ( I have<a href="http://zbxkfoo.com"> aalerdy</a> tried replacing jpg eith png )?I am using a child theme of twenty eleven by the way

3  
try to replace both teplamte' references with stylesheet' references; for instance:<?php $page_id=get_the_ID();if(is_page()) { $image='head-image-'.$page_id.'.jpg'; };if(!file_exists(STYLESHEETPATH.'/images/'.$image)) { $image='head-image.jpg'; }echo '<img src="'.get_stylesheet_directory_uri().'/images/'.$image.'" alt="" />'; ?>hope this helps

1  
bạn cho mình code tạo hộp comment cho website đựoc hok, mình nhớ web của bạn có mà sao bữa giờ cần mà tìm wài hok thấy

2  

Only registered users can add comments.
[ Registration | Login ]
Login Form
Nhận bài qua Email


Đăng ký để nhận thông tin
và bài post mới nhất qua email

Chuyên mục
Toàn tập Dmon/ Ucoz [22]
Hướng dẫn thiết kế website với dịch vụ của Dmon.com/ Ucoz.com,...
Code [18]
Các code giúp bạn cá nhân hóa trang web của bạn
Design [21]
Các công cụ web giúp thiết kế web....
Featured Post - Image Gallery [15]
Menu [5]
Các Menu đẹp cho web của bạn
Tab Content [6]
Templates [3]
Toàn bộ thiết kế Template
Khác [0]
Rearch
Thống kê

Total online: 1
Guests: 1
Users: 0
Bản đồ truy cập
Locations of visitors to this page