Information | Submitted Assignments(12)
Item | Discription |
Late Submission | No |
Open | Yes |
Attribute | Team assignment |
Percentages | 10% |
Deadline | 2011-03-28 12:00 |
Attachments | |
Content | 希望透過實作,熟悉使用 Javascript + jQuery 操作 DOM 物件
例如,選單、拖曳、縮放、彈跳視窗、相片瀏覽等
範例:
<html>
<head> <style> #ctrl {color:#f00; cursor:pointer; border:1px solid #ccc; width:100px} #popup { position:absolute; padding:5px; border:2px solid #aaa; background:#ffc; display:none } </style> <script type="text/javascript" src='/html/jquery/jquery.js'></script> <script> $(document).ready(function(){ $("#ctrl").bind('click', function() { showPopup(100, 100); }); }); function showPopup(x, y, w, h) { w = (w) ? w : 300; h = (h) ? h : 200; var style = {'left':x, 'top':y, 'width':w, 'height':h} $("<div id=popup>abc</div>").css(style).appendTo("body").fadeIn(1000); } </script> </head> <body> <div id=ctrl>open dialog</div> </body> </html> |