CSS让指定的图片实现水平/翻转特效

最新推荐文章于 2024-06-20 11:25:50 发布

weixin_33670713

最新推荐文章于 2024-06-20 11:25:50 发布

阅读量475

点赞数

原文链接：http://www.cnblogs.com/webdm/archive/2012/03/29/2423047.html

版权

代码简介：

CSS的Alpha滤镜效果，再配合JS来控制水平或者是垂直翻转，还是很实用的。

代码内容：

View Code

<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">
<TITLE>CSS让指定的图片实现水平/翻转特效 - www.webdm.cn</TITLE>

<SCRIPT LANGUAGE=javascript>
<!--
function setFliph(){
        obj.style.filter=obj.style.filter=="fliph"?"":"fliph";

    }
function setFlipv(){
        obj.style.filter=obj.style.filter=="flipv"?"":"flipv";
    }
//-->
</SCRIPT>

</HEAD>
<BODY>

<h4 align="center">Alpha滤镜效果</h4>
<div align="center"><img src="http://www.webdm.cn/images/20091108/fan.jpg"  id="obj"></div>
<FORM id=form1 name=form1>
请选择滤镜参数:    

<INPUT type="button" value="水平翻转" onclick="setFliph()">
<INPUT type="button" value="垂直翻转" onclick="setFlipv()">

</FORM>
</BODY>
</HTML>
<br />
<p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的网页代码下载网站 - 致力为中国站长提供有

质量的网页代码！</p>

代码来自：http://www.webdm.cn/webcode/80d4e3cb-9185-447b-af5e-9f9412a9164b.html

转载于:https://www.cnblogs.com/webdm/archive/2012/03/29/2423047.html

weixin_33670713

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS让指定的图片实现水平/翻转特效

代码简介：CSS的Alpha滤镜效果，再配合JS来控制水平或者是垂直翻转，还是很实用的。代码内容：View Code <HTML><HEAD><META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0"><TITLE>CSS让指定的图片实现水平/翻转特效 - www.we...
复制链接

扫一扫