Code tạo ảnh trượt 2 bên trang web, blogHôm nay ĐTN BLOG xin gửi đến quý thầy cô đoạn code tạo ảnh trượt 2 bên trang web, blog như của trang này.. Các bạn sửa theo hướng dẫn rồi copy vào
Trang 1Code tạo ảnh trượt 2 bên trang web, blog
Hôm nay ĐTN BLOG xin gửi đến quý thầy cô đoạn code tạo ảnh trượt 2 bên trang web, blog như của trang này Các bạn sửa theo hướng dẫn rồi copy vào khối chính hoặc khối chức năng đều được Ảnh hiển thị tốt hơn ở trình duyệt Firefox và Google Chrome
<html>
<head>
<title>uoon demo Set Position</title>
<style type="text/css">
.float {
width: 115px;
height: 200px;
border: solid 1px blue;
}
</style>
</head>
<body>
<div style="width: 0px;height: 0px;">
<div id="a" class="float"><a href=" Link địa chỉ bạn muốn dẫn đến khi bấm chuột vào ảnh phải "><img src=' Link của ảnh sẽ hiển thị bên phải '></div>
<div id="c" class="float"><a href=" Link địa chỉ bạn muốn dẫn đến khi bấm chuột vào ảnh trái"><img src=' Link của ảnh sẽ hiển thị bên trái '></div>
</div>
</body>
<script type="text/javascript">
function setPosition(id, position) {
Trang 2
var store = { ram : { top : 0, left : 0, right : 0, bottom : 0 },
rom : { top : null, left : null, right : null, bottom : null }
};
for (var i in position) {store.rom[i] = position[i];}
var element = document.getElementById(id);
for (i in store) {element[i] = store[i];}
element.rom.move = function() {
if (window.innerHeight) {
Trang 3var topPage = window.pageYOffset;
var leftPage = window.pageXOffset;
var rightPage = leftPage + window.innerWidth - element.offsetWidth;
var bottomPage = topPage + window.innerHeight - element.offsetHeight;
}
else {
var topPage = document.body.scrollTop;
var leftPage = document.body.scrollLeft;
var rightPage = leftPage + document.body.clientWidth - element.offsetWidth;
var bottomPage = topPage + document.body.clientHeight - element.offsetHeight; }
element.style.position = "absolute";
if (element.rom.top != null) {
element.ram.top += Math.round((topPage + element.rom.top - element.ram.top)/20); element.style.top = element.ram.top;
}
if (element.rom.left != null) {
element.ram.left += Math.round((leftPage + element.rom.left - element.ram.left)/20); element.style.left = element.ram.left;
}
if (element.rom.right != null) {
element.ram.right += Math.round((rightPage element.rom.right -element.ram.right)/20);
element.style.left = element.ram.right;
}
if (element.rom.bottom != null) {
Trang 4element.ram.bottom += Math.round((bottomPage element.rom.bottom -element.ram.bottom)/20);
element.style.top = element.ram.bottom;
}
setTimeout("document.getElementById('"+element.id+"').rom.move()",10); };
element.rom.move();
}
setPosition("a", {top: 20, right: 30});
setPosition("c", {top: 20, left: 30});
</script>
</body>
</html>
Chúc thành công!