Kênh 360 Công Nghệ Kênh 360 Công Nghệ

Trang chủ - Thiết kế web - Lập trình Javascript - Lập trình Javascript tạo 1 cửa sổ động

Lập trình Javascript tạo 1 cửa sổ động

Tạo 1 cửa sổ có thể kéo thả, di chuyển trên trình duyệt. Mã nguồn Javascript. Chạy thử nghiệm thành công trên các trình duyệt IE6, Mozilla/Firefox, Opera 7.54 (Windows), Safari, Mozilla (Macintosh). Download file drag.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="/cntt/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="/cntt/How can I create a floating window on my html page.files/close_btn.gif" border="0"/>
</div>
</div>
<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>
</div>


Tin mới hơn:
Tin cũ hơn:

 

Kênh 360 công nghệ

  • Nổi bật
  • Tin mới
  • Game mới
  • PrestaShop Guide
  • PrestaShop

Có thể bạn quan tâm

Download nhiều nhất

11/12
Download PES 2011 - FIFA 11
693
18/12
binkw32 dll
175
18/12
TeamViewerQS
49
English French German Japanese Korean