javascript 设置图片透明度与图片的水平垂直旋转

最新推荐文章于 2023-05-09 22:34:08 发布

要争气

最新推荐文章于 2023-05-09 22:34:08 发布

阅读量2.2k

点赞数

文章标签： JavaScript

本文链接：https://blog.csdn.net/liangwenmail/article/details/48719475

版权

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function fn(){
		document.getElementById("d1").style.filter="alpha(opacity=50)";
	}
	function fn1(){
		document.getElementById("d2").style.filter=document.getElementById("d2").style.filter=="flipH"?"":"flipH";
	}
	function fn2(){
		document.getElementById("d2").style.filter=document.getElementById("d2").style.filter=="flipV"?"":"flipV";
	}
</script>
</head>
<body οnlοad="fn();">
<div id="d1">
<img src="ph/1.jpg" style="width:300px;height: 200px; ">
</div>
<div id="d2">
<img src="ph/2.jpg">
</div><br><br>
<input type="button" value="水平翻转" οnclick="fn1();">
<input type="button" value="垂直翻转" οnclick="fn2();">
</body>
</html>