仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 668|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 来谈谈:剧本把持三行三列自顺应高度DIV结构

[复制链接]
萌萌妈妈 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-16 00:25:44 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
目前我们的站就是div+CSS做的,美工可以通过css直接控制我的程序输出的页面动态数据的样式DIV就只是布局元素.
这个例子是用JS剧本把持并列DIV的高度,一般在DIV结构中,自顺应高度一向是对照头疼的成绩,一样平常多数接纳背景图、外衣DIV、右栏掩盖左栏......来办理。如今加了剧本后,复杂多了,假设有三个程度并列的DIV,fbox、mbox、sbox,只需在<body>标签中写进:onload="P7_equalCols(fbox,mbox,sbox)",测试前提:ie5.x、ie6.0、FF1.03、NS7.2、opera8.01最后的效果.htm
JS代码:版权回原作者,仅供进修研讨.
以下是援用片断:
/*
------------------------------------------------
PVIIEqualCSSColumnsscripts
Copyright(c)2005ProjectSevenDevelopment
www.projectseven.com
Version:1.5.0
------------------------------------------------
*/
functionP7_colH(){//v1.5byPVII-www.projectseven.com
vari,oh,hh,h=0,dA=document.p7eqc,an=document.p7eqa;if(dA&&dA.length){
for(i=0;i<dA.length;i++){dA[i].style.height=auto;}for(i=0;i<dA.length;i++){
oh=dA[i].offsetHeight;h=(oh>h)?oh:h;}for(i=0;i<dA.length;i++){if(an){
dA[i].style.height=h+px;}else{P7_eqA(dA[i].id,dA[i].offsetHeight,h);}}if(an){
for(i=0;i<dA.length;i++){hh=dA[i].offsetHeight;if(hh>h){
dA[i].style.height=(h-(hh-h))+px;}}}else{document.p7eqa=1;}
document.p7eqth=document.body.offsetHeight;
document.p7eqtw=document.body.offsetWidth;}
}
functionP7_eqT(){//v1.5byPVII-www.projectseven.com
if(document.p7eqth!=document.body.offsetHeight||document.p7eqtw!=document.body.offsetWidth){
P7_colH();}
}
functionP7_equalCols(){//v1.5byPVII-www.projectseven.com
if(document.getElementById){document.p7eqc=newArray;for(i=0;i<arguments.length;i++){
document.p7eqc[i]=document.getElementById(arguments[i]);}setInterval("P7_eqT()",10);}
}
functionP7_eqA(el,h,ht){//v1.5byPVII-www.projectseven.com
varsp=10,inc=10,nh=h,g=document.getElementById(el),oh=g.offsetHeight,ch=parseInt(g.style.height);
ch=(ch)?ch:h;varad=oh-ch,adT=ht-ad;nh+=inc;nh=(nh>adT)?adT:nh;g.style.height=nh+px;
oh=g.offsetHeight;if(oh>ht){nh=(ht-(oh-ht));g.style.height=nh+px;}
if(nh<adT){setTimeout("P7_eqA("+el+","+nh+","+ht+")",sp);}
}
</p>
你的设计不仅仅用于web浏览器,也可以发布在其他设备上,比如PowerPoint。
飘飘悠悠 该用户已被删除
沙发
发表于 2015-1-18 06:38:00 | 只看该作者
使用内容管理系统进行开发并实现快速、精确的浏览器兼容性测试。
变相怪杰 该用户已被删除
板凳
发表于 2015-1-24 23:03:15 | 只看该作者
还是在Dreamweaver所见即所得添加链接是,可以选中文字或图片然后按下shift键不放鼠标拖出箭头直接指向文件即可。这是比较简单的也是常用的方之一。
简单生活 该用户已被删除
地板
发表于 2015-2-2 15:44:08 | 只看该作者
运动)时间轴面板--拖动关键帧--单击整条--将鼠标移至中间一点--右击选择增加关键帧--移动中间关键帧的图层--勾选自动播放,循环
金色的骷髅 该用户已被删除
5#
发表于 2015-2-8 02:56:42 | 只看该作者
Dreamweaver由MX版本开始使用Opera软件公司的排版引擎“Presto”作为网页预览。
海妖 该用户已被删除
6#
发表于 2015-2-24 09:19:53 | 只看该作者
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
若相依 该用户已被删除
7#
发表于 2015-3-7 12:02:03 | 只看该作者
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。
因胸联盟 该用户已被删除
8#
发表于 2015-3-15 06:09:01 | 只看该作者
由CS4 版本开始,则转用WebKit 排版引擎(亦即Google Chrome和Apple Safari浏览器所用的排版引擎)作为网页预览。
蒙在股里 该用户已被删除
9#
发表于 2015-3-21 21:58:17 | 只看该作者
Dreamweaver在所见即所得添加链接,也可以先选中文字或图片然后在属性栏中的链接栏后的一个小圆圈,用鼠标点击小圆圈按住不放拖动出箭头然后指向文件即可。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-12-29 21:50

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表