jquery插件

 

前端技术的jquery大量使用;

 

主要的:

弹出层;

弹出图片;

小的提示层;(可用于解释,输入验证提示)

 

 

 

Colorbox    ---弹出层,(主要应用:弹出图片查看)

Lightbox    ---弹出层,显示图片;

 

 

Colorbox

 

http://www.cnblogs.com/linzheng/archive/2010/11/17/1880182.html

http://www.cnblogs.com/linzheng/tag/jQuery/

 

 

中文:

< html   lang ="zh">

 

title   |  默认值 false  |   这可以为 Colorbox 设置一个标题

 

 

取消:

< input   id ="Reset1"   type ="reset"   value ="取消"   />

< script >

    $( "#Reset1" ).click( function  () {

        $( '#Reset1' ).colorbox.close();

    });

</ script >

 

 

弹出窗体显示html 内容;

$( '#Button_Save' ).colorbox({ html:  'Hello'  }); 

 

 

弹出页面:

< a   id ="href1"> 弹出页面 </ a >

$( '# href1 ' ).colorbox({ href:  " ajax.html "  });

 

 

<div id="myForm"></div>

inline    false  如果是 true,jQuery 选择器可以用来选择要显示的元素。

Example: $("#inline").colorbox({inline:true, href:"#myForm"});

 

 

Ajax

< a   class ='ajax'   href ="mainInterface/ajax.html"   title ="Homer Defined"> Outside HTML (Ajax) </ a >

$( ".ajax" ).colorbox();

 

 

Iframe:     ---可以应用于 aspx 环境;

< p >< a   class ='iframe'   href ="mainInterface/cancleOrder.aspx"> Outside Webpage (Iframe) </ a ></ p >

$( ".iframe" ).colorbox({iframe: true , width: "80%" , height: "80%" });

---iframe中的取消:

< script   type ="text/javascript">

    $( "#Reset1" ).click( function  () {

        parent.$( "#Reset1" ).colorbox.close();

    });

</ script >

 

 

你可能感兴趣的:(jquery插件)