[Javascript]Tạo cửa sổ động Đây là 1 chức năng của JavaScript code để giúp bạn tạo ra 1 cửa sổ động. Nó đã thử nghiệm thành công trên IE6, Mozilla/Firefox, Opera 7.54 (Windows), Safari, Mozilla (Macintosh). Download file .js này về và include nó vào trong trang html của bạn như hình dưới:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Floating Window</title>
<script src="Drag.js"></script>
</head>
<body>
.......
</body>
</html>
Code của cửa sổ động như sau:
<div id="window" style="position:absolute; z-index:10; left:350px; top:160px; width:400px;background-color:#dde3eb; border:1px solid #464f5a; display:none;">
<div style="padding-bottom:8px; width:400px; background-color:#718191; border-bottom:1px solid #464f5a;" onMouseDown="beginDrag(this.parentNode, event);">
<div style="position:absolute; top:2px; left:5px; font-size:16px; font-weight:bold; color:#FFFFFF;">Drag me!</div>
<div style="position:absolute; top:3px; left:377px; float:right;" onClick="this.parentNode.parentNode.style.display = 'none';">
<img src="How can I create a floating window on my html page.files/close_btn.gif" border="0"/>
</div>
</div>
<br/>
<div style="margin-left:20px;">your content here...</div>
<div style="margin-left:30px;">your content here...</div>
<div style="margin-left:40px;">your content here...</div>
<br/>
</div>
Nếu bạn có thêm kỹ năng trong CSS và lập trình JavaScript, bạn có thể thêm vào nhiều thiết kế và chức năng hấp dẫn cho chính cửa sổ này của mình. |