Demo:
Để làm được việc này các bạn chèn đoạn code sau vào vị trí muốn hiển thị (nếu muốn hiển thị tất cả các trang các bạn có thể chèn vào footer)
<script type="text/javascript" src="http://thuthuatso.com/jquery.js"></script>
<style type=”text/css”>
#floating
{
z-index: 450;
position: absolute;
width: 490px;
height: 368px;
}
#overPage
{
background: black;
z-index: 350;
position: absolute;
left: 0;
top: 0;
}
</style>
<!–Begin Adv Popup–>
<div id=”ctl00_ContentPlaceHolder1_Adv_Popup_pnAdv”>
<div id=”overPage”>
</div>
<div id=”floating”>
<img src=”link ảnh” width=”490″ height=”360″ usemap=”#offline”
border=”0″ style=”cursor: pointer” /></div>
<map name=”offline”>
<area shape=”rect” coords=”420,0,490,30″ onclick=”javascript:closeMe();” alt=”Close”
style=”cursor: pointer” />
<area shape=”rect” coords=”0,30,490,330″ href=”Url site click vào ảnh ” target=”_blank” onclick=”javascript:closeMe();” style=”cursor: pointer” />
</map>
<script language=”javascript” type=”text/javascript”>
var lastScroll;
var delay = 30;
var speed = 500;
var img_w = 490;
var img_h = 360;
function centerIt() {
$(“#overPage”).css(“width”, $(window).width());
$(“#overPage”).css(“height”, $(document).height());
$(“#floating”).css(“left”, $(window).width() / 2 – img_w / 2);
$(“#floating”).css(“top”, $(window).height() / 2 – img_h / 2 + $(document).scrollTop());
}
$(document).ready(function() {
$(“#overPage”).css(“opacity”, 0.7);
$(“#overPage,#floating”).show();
centerIt();
});
$(window).scroll(function() {
setTimeout(function() { ani(); }, delay);
lastScroll = new Date().getTime();
});
$(window).resize(function() {
centerIt();
});
function ani() {
if ((new Date().getTime() – lastScroll) >= (delay – 20)) {
$(“#floating”).animate({ top: ($(window).height() / 2 – img_h / 2 + $(document).scrollTop()) }, speed);
}
}
function closeMe() {
$(“#overPage,#floating”).hide();
}
</script>
</div>
<!–End Adv Popup–>
Các bạn thay link ảnh và link site cho phù hợp nhá
Vậy là xong. Bây giờ các bạn có thể ra ngoài trang chủ xem thành quả cảu mình rồi
Post a Comment
Cảm ơn bạn đã ghé thăm Blog của mình!
Để nhận thông báo mới nhất về bài đăng bạn hãy tick vào ô vuông bên phải ("Thông báo cho tôi")
Cảm ơn bạn!