首 页
网络学院
视频教程
资源下载
HOT
实例教程
图文教程
专题中心
学习社区
繁體中文
当前位置:
首页
>
图文教程
>
网页制作
>
CSS样式表
> 放大缩小VML
CSS样式表
css 简单区别ie6,ie7,firefox的写法
解决在IE6下文字溢出(多出一行字)的解决方法小结
纯css 鼠标移上查看大图的效果
css 完美清除浮动的两种解决方案
css 透明度的设置兼容所有浏览器
pre 自动换行的问题
CSS 图片定位的几种方式
div+css学习笔记(IE与fox好多不兼容的问题)
让你的页面对 IE6 显示出黑白色(多浏览器)
li 自适应宽度
样式表达式实现交替显示table行颜色
css 控制图片大小 小于固定值 控制大小
CSS 各种滤镜代码解释 用法案例
针对firefox ie6 ie7 ie8的css样式hack
CSS 样式 层裁剪图片
十个非常实用的CSS属性(IE不支持)
CSS渲染速度改善的十个方法与建议
css z-index 最大值
css z-index 在IE中的迷惑
IE与Firefox中兼容的html设计中使用CSS改变鼠标为手形
No.
«
‹
17
18
19
20
›
»
技术文章搜索
关键字
CSS样式表 中的 放大缩小VML
出处:
互联网
整理:
软晨网(RuanChen.com)
发布:
2009-09-12
浏览: 86 ::
收藏到网摘: n/a
脚本动态生成VML
给VML增加事件
由于VML是矢量的,放大缩小变得很容易了。我们先看一个例子,看看VML能做到什么程度。还是以前面的一个飞碟做为例子。它是用线、圆、弧等形状拼凑起来的一个图形。我增加了移动事件,当放大太多了,可以拖动图片查看。
放大 1倍
放大 2倍
放大 3倍
放大 4倍
放大 5倍
放大 6倍
放大 7倍
放大 8倍
放大 9倍
放大10倍
是否感觉出来了,放大缩小对 VML 的画质没有改变?因为 VML 是矢量的。动态改变它的 coordsize 值就可以了,注意,减小值等于放大,增大值就等于缩小。可以参考下面的脚本:
var xx=6000;
var yy=6000;
function zoom(h)
{
group1.coordsize=
xx/h+","+yy/h;
}
上面的 xx,yy 是指默认状态下的 coordsize 值。调用这个函数的时候使用 zoom(n) 其中 n 是要放大的倍数。
当VML中包含 文字的时候,图形放大了,但文字不会自动放大。这样一来就很不对称了,有个技巧,就是文字都用一种标记包着,放大函数就需要改进一下了:
var xx=6000;
var yy=6000;
var fs=9;
function zoom(h)
{
group1.coordsize=
xx/h+","+yy/h;
for(var i=0;i<document.all.tags("DIV").length;i++)
document.all.tags("DIV").item(i).style.fontSize=
fs*h+"pt"
;
}
fs是默认状态下的文字大小。document.all.tags("DIV") 将返回页面上所有DIV元素,然后把他们的文字大小都变大。实践证明,放大后和VML的比例是不变的。
脚本动态生成VML
给VML增加事件
评论 (0)
All
登陆
还没注册?