举个列子:
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>div显现与隐藏</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function toggle(targetid){
if (document.getElementById){
target=document.getElementById(targetid)
if (target.style.display=="block"){
target.style.display="none"
} else {
target.style.display="block"
}
}
}
-->
</script>
<style type="text/css">
<!--
#div1{
background-color:#000000
height:400px
width:400px
display:none
}
-->
</style>
</head>
<body>
<input type="button" id="butn" value="显示/隐藏" onclick="toggle('div1')" />
<center>
<div id="div1"></div></center>
</body>
</html>
我把核心给你写好了,剩下的就靠你自己装饰一下了。比如把div夸大到全屏,该div 内容等。。
在HTML编辑器上即可。首先将两个要展示的图片利用定位重叠在一起。然后利用CSS3的perspective结合transform:ratateY()属性实现翻转效果即可。
HTM是HyperTextMark-upLanguage的缩写,即超文本标记语言(标准通用标记语言下的一个应用),是WWW的描述语言。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)