首页
网页制作
网络编程
脚本专栏
数据库
网站运营
网络安全
平面设计
CMS教程
搜索
建站极客
网络编程
CSS/HTML
正文
放大缩小VML
所属分类:
网络编程
/
CSS/HTML
阅读数: 1521
收藏 0
赞 0
分享
由于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的比例是不变的。
更多精彩内容
其他人还在看
简单明了带你了解CSS Modules
不要误会,CSS Modules可不是在说“css模块化”这个好像在某些地方见过的词,它其实是特指一种近期才出现的技术手段。什么技术手段呢?下面小编来和大家一起学习一下
评论 0
收藏 0
赞 0
分享
新手学习css优先级
大部分人同样也会在写css的过程中产生很多困惑,比如为什么自己写的某段css没有生效,或者呈现出的样式和预计的不同,但又不知道要如何解决。下面小编来和大家一起学习CSS的优先级
评论 0
收藏 0
赞 0
分享
css进阶学习 选择符
css这种没有程序逻辑的代码中,又能找出什么来说明谁做得更出色呢?下面小编给大家说明如何从css选择符的角度来提高css代码质量。
评论 0
收藏 0
赞 0
分享
实现css文字垂直居中的8种方法
CSS可以轻易实现文字的水平居中,但有时我们需要文字垂直居中,除了表格可以实现这种CSS文字垂直居中以外,还有其它几种方法可以做到
评论 0
收藏 0
赞 0
分享
完美实现CSS垂直居中的11种方法
在做前端项目时CSS的水平居中我们经常使用,但有时还会用到CSS垂直居中,对于小白来说这个就有些难度了,下面看一下我是如何实现的
评论 0
收藏 0
赞 0
分享
webpack高级配置与优化详解
这篇文章主要介绍了webpack高级配置与优化,其中包括了webpack打包多页面,webpack跨域问题等相关内容
评论 0
收藏 0
赞 0
分享
5个HTML5的常用本地存储方式详解与介绍
在HTML5规范之前,存储主要是用cookies,但cookies缺点有在请求头上带着数据,大小是4k之内,今天为大家介绍一下H5的5种存储方式
评论 0
收藏 0
赞 0
分享
CSS代码检查工具stylelint的使用方法详解
stylelint是一个强大的现代CSS检测器,可以让开发者在样式表中遵循一致的约定和避免错误。本文将详细介绍CSS代码检查工具stylelint
评论 0
收藏 0
赞 0
分享
Zen Coding css,html缩写替换大观 快速写出html,css
本文是在zen使用生产中遇到的问题做一些分享。
评论 0
收藏 0
赞 0
分享
javascript代码规范小结
javascript代码规范,大家可以参考下,以便写出更利于阅读的代码。
评论 0
收藏 0
赞 0
分享
查看更多
网络赚钱
更多
90后网络爆红美女卖"毒面膜" 年收入超七位数
揭秘朋友圈面膜:足不出户 国内生产俩月造出国际大牌
漂洋过海坑死你 海淘代购名为国际大牌实为国产的山寨货
网络公司的普通程序员如何利用QQ营销月赚万元
这么些年 你真的会网购吗 省钱赚钱秘籍
Google AdSense 电汇教程 谷歌联盟国内电汇收款教程(招行)
站长故事
更多
美团副总裁杨俊:做O2O的4个关键节点 会高效率地花钱
站长故事:一个80后妈妈的微商之旅
论诺基亚之死!
站长们,就别在折腾你的用户了
验证码广告:站长增加收入的另一种新渠道
年轻站长的苦逼SEO路:虽难却依旧顽强的坚持着