[JQuery] jquery dialog 範例

房東：小強
發表時間：2011-06-08

<html>

02 <body>

03

`04`	`<script src="http://www.google.com/jsapi"></script>`

`05`	`<script>`

`06`	`google.load("jquery",` `"1.4");`

`07`	`google.load("jqueryui",` `"1.7");`

`08`	`</script>`

09

`10`	`<link rel="stylesheet"` `href="http://jquery-ui.googlecode.com/svn/tags/latest/themes/base/jquery-ui.css"` `type="text/css"` `media="all"` `/>`

11

12

13

`14`	`<div id="dialog"` `title=""` `style="display:none;">`

15 </div>

16

`17`	`<a hrer="javascript:"` `onclick="btn();">資料</a>`

18

`19`	`<script>`

`20`	`function` `btn() {`

21

22

`23`	`var` `data='<b>你好</b><br>測試';`

24

`25`	`$('#dialog').html( data );`

26

27

`28`	`$('#dialog').css({display:'inline'});`

29

`30`	`$("#dialog").dialog({`

`31`	`title:` `'資料',`

`32`	`bgiframe:` `true,`

`33`	`width: 350,`

`34`	`height: 350,`

`35`	`modal:` `true,`

`36`	`draggable:` `true,`

`37`	`resizable:` `false,`

`38`	`overlay:{opacity: 0.7, background:` `"#FF8899"` `},`

39

`40`	`buttons: {`

`41`	`'關閉':` `function() {`

`42`	`$(this).dialog('close');`

43 }

44 }

45 });

46

47

48 }

`49`	`</script>`

50

51 </body>

52 </html>

效果：

http://mini.nidbox.com/diary/read/193

贊助網站

廣利不動產-新板特區指名度最高、值得您信賴的好房仲
您的托付,廣利用心為您服務
廣利不動產-板橋在地生根最實在--新板特區指名度最高、值得您信賴的好房仲
完整房訊，房屋、店面熱門精選物件，廣利不動產優質仲介，房屋租賃、買賣資訊透明，交易真安心！

　共 0 人回應

姓名：

佈告內容：

其他選項: