HTML 如何实现页面翻转效果 请给例子

HTML 如何实现页面翻转效果 请给例子,第1张

可以用控制div的显现的方式。可以用js。

举个列子

<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的描述语言。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7373952.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-04
下一篇 2023-04-04

发表评论

登录后才能评论

评论列表(0条)

保存