关于jQuery自动生成html代码的方法--wrap用法
来源:互联网 发布:black韩剧 知乎 编辑:程序博客网 时间:2024/05/16 04:03
源码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Onion Skin DropShadwo with jQuery</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style>
.wrap0, .wrap1, .wrap2, .wrap3 {
display:inline-table;
/* /*/display:block;/**/
}
.wrap0 {
float:left;
background:url(shadow.gif) right bottom no-repeat;
}
.wrap1 {
background:url(shadow180.gif) no-repeat;
}
.wrap2 {
background:url(corner_bl.gif) -18px 100% no-repeat;
}
.wrap3 {
padding:10px 14px 14px 10px;
background:url(corner_tr.gif) 100% -18px no-repeat;
}
body { background: #fff;}
</style>
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$("img.dropshadow")
.wrap("<div class='wrap0'><div class='wrap1'><div class='wrap2'>" +
"<div class='wrap3'></div></div></div></div>");
});
</script>
</head>
<body>
<h1>Onion Skinned - With jQuery</h1>
<p>First, the old-school, multiple divs hard coded into the html as seen on the <a href="http://www.p ></a>
<div class="wrap0">
<div class="wrap1">
<div class="wrap2">
<div class="wrap3">
<img src="ball.jpg" alt="The object casting a shadow" />
</div>
</div>
</div>
</div>
<p style="clear:both;">And now, the jQuery method, which uses javascript to wrap the image at runtime
<img src="ball.jpg" class = "dropshadow" alt="The object casting a shadow" />
<p>View the source of this page and you'll see the huge difference in markup!</p>
</body>
</html>
wrap可以自动生成包含指定Class的页面。。。
如本例将在: <img src="ball.jpg" class = "dropshadow" alt="The object casting a shadow" /> 外面生成三个层。
三个层如下:
div class='wrap0'><div class='wrap1'><div class='wrap2'>
<div class='wrap3'>
</div></div></div></div>
- 关于jQuery自动生成html代码的方法--wrap用法
- jQuery中的wrap()方法
- Jquery 修改 动态生成的Html代码
- asp自动生成html文件的方法
- asp自动生成html文件的方法
- 关于自动生成代码工具的构想
- 使用jquery的wrapAll()和wrap()方法包装元素
- jquery的wrapAll()和wrap()方法包装元素(转)
- 关于MVC中Html.DropDownList生成的html代码
- PHP定时自动生成静态HTML的实现代码
- 关于jQuery中on()方法的用法
- 关于jquery中的extend方法的用法
- [转]python 代码自动生成的方法 (代码生成器)
- ASP信息页面自动生成HTML的两种方法
- 织梦DedeCMS定时自动生成首页HTML的方法
- 关于jquery的html() val() text()区别用法
- lingo中@wrap的用法
- jQuery动态生成html元素的几种方法
- [转]Boost.Bind的基础使用
- OSGI简介
- Repeater绑定datarow和ilist
- 数字转人民币 方法
- 虚拟机桥接上网配置
- 关于jQuery自动生成html代码的方法--wrap用法
- 浏览器的两种模式quirks mode 和strict mode
- 网页边下载边显示
- 使用Bash编写Linux Shell脚本-6.表达式
- SQL中AND和OR的运算顺序, AND优先级>OR优先级
- http://writeblog.csdn.net/PostEdit.aspx
- 50个实用的JavaScript工具
- 虚拟机host-only上网配置
- sqldatetime的用法