Invincible soul
11-02-2009, 10:26
Thấy hay hay nên lên mạng mò thử, nay share cho bạn nào chưa biết.
Ứng dụng: dùng để quảng cáo những gì bạn muốn, muốn show hình của "ai đó" trong blog (email) (cái này mình đang kết).
Nào bắt đầu:
1. Bạn copy đoạn mã sau vào phần head của web
<style type="text/css">
#info p {margin-left:15px; margin-right:20px;}
a.screen, a.screen:visited {
color:#c00;
position:relative;
z-index:1;
}
a.screen b {
position:absolute;
visibility:hidden; /* hide the image */
width:200px; /* give it a width */
height:0; /* no height to solve an Opera bug that makes it selectable when hidden */
border:1px solid #000; /* add a border */
left:0; /* position:the image */
top:-150px;
}
a.screen:hover {
text-decoration:none;
border:0; /* needed for this to work in IE */
z-index:1000;
}
a.screen:hover b {
visibility:visible; /* make the image visible */
height:150px; /* now give it a height */
cursor:pointer; /* for IE */
z-index:500;
}
a.screen:hover b img {
border:0; /* remove the link border */
}
</style>
2. Bạn chèn đoạn code này cho cái mà bạn muốn thể hiện, ví dụ: hình của tui
<a class="screen" href="#nogo">hình của tui<b><img src="hình của tui.jpg" alt="hình của tui" title="hình của tui" /></b></a>
3. F5 lại mà coi.
-lệnh #nogo là khi bạn click vào cái hyperlink thì nó ko mở trang.
-Bạn tham khảo thêm ở trang :http://www.cssplay.co.uk/menu/pop_ups#nogo
Ứng dụng: dùng để quảng cáo những gì bạn muốn, muốn show hình của "ai đó" trong blog (email) (cái này mình đang kết).
Nào bắt đầu:
1. Bạn copy đoạn mã sau vào phần head của web
<style type="text/css">
#info p {margin-left:15px; margin-right:20px;}
a.screen, a.screen:visited {
color:#c00;
position:relative;
z-index:1;
}
a.screen b {
position:absolute;
visibility:hidden; /* hide the image */
width:200px; /* give it a width */
height:0; /* no height to solve an Opera bug that makes it selectable when hidden */
border:1px solid #000; /* add a border */
left:0; /* position:the image */
top:-150px;
}
a.screen:hover {
text-decoration:none;
border:0; /* needed for this to work in IE */
z-index:1000;
}
a.screen:hover b {
visibility:visible; /* make the image visible */
height:150px; /* now give it a height */
cursor:pointer; /* for IE */
z-index:500;
}
a.screen:hover b img {
border:0; /* remove the link border */
}
</style>
2. Bạn chèn đoạn code này cho cái mà bạn muốn thể hiện, ví dụ: hình của tui
<a class="screen" href="#nogo">hình của tui<b><img src="hình của tui.jpg" alt="hình của tui" title="hình của tui" /></b></a>
3. F5 lại mà coi.
-lệnh #nogo là khi bạn click vào cái hyperlink thì nó ko mở trang.
-Bạn tham khảo thêm ở trang :http://www.cssplay.co.uk/menu/pop_ups#nogo