翻牌子

- 日理万妓 2022-06-05 09:06 159阅读 0赞

![这里写图片描述][SouthEast]

<!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style type="text/css"> /* * 英雄和详情是叠加的 * 英雄是正面 * 详情是背面 * 当光标进入的时候 * 英雄变成背面 * 详情变成正面 * */ #hero{ backface-visibility: hidden; transition: transform 3s ease; } #hero_detail{ backface-visibility: hidden; transform: rotateY(180deg); transition: transform 3s ease; } img{ position: absolute; left: 0px; top:0px; } #container{ position: relative; } </style>
            <script type="text/javascript"> onload = function () { var container = document.getElementById("container"); var hero = document.getElementById("hero"); var hero_detail = document.getElementById("hero_detail"); //鼠标点进去,翻转 container.onmouseenter = function () { // 把英雄翻转180，详情翻转180 hero.style.transform = "rotateY(180deg)"; hero_detail.style.transform = "rotateY(0deg)"; } //鼠标移出来,返回 container.onmouseleave = function () { hero.style.transform = "rotateY(0deg)"; hero_detail.style.transform = "rotateY(180deg)"; } } </script>
        </head>
        <body>
    
            <div id="container">
                <img src="img/hero.jpg" id="hero"/>
                <img src="img/heroDetail.png" id="hero_detail"/>
            </div>
    
        </body>
    </html>

[SouthEast]: /images/20220605/5eeef22793a44c309df223e5e7079fb8.png

发表评论取消回复

表情：

评论列表（有 0 条评论，159人围观）

还没有评论，来说两句吧...

相关阅读

相关翻硬币游戏

[【转】博弈-翻硬币游戏][-] 翻硬币游戏一般的翻硬币游戏的规则是这样的： N 枚硬币排成一排，有的正面朝上，有的反面朝上。我们从左开始对硬币

r囧r小猫/ 2023年10月11日 09:37/ 0 赞/ 7 阅读

相关 cylinders(cylinder是什么牌子)

硬盘跳线(5行英文)SlAVEMASTERORSINGLEDRI SlAVE——从盘(模式) MASTER OR SINGLE DRIVE——主盘(模式)或者单一驱动器

约定不等于承诺〃/ 2023年09月26日 12:59/ 0 赞/ 99 阅读

相关 description(description是什么牌子)

description什么意思 description音节划分：de▪scrip▪tiondescription 英 \[dɪˈskrɪpʃn\] 美 \[dɪˈskrɪ

柔情只为你懂/ 2023年09月26日 12:12/ 0 赞/ 118 阅读

相关翻牌动画

效果如下(可兼容移动端)： ![20190618103228278.gif][] css部分： <style type="text/css"> \, \:before,

桃扇骨/ 2022年10月02日 10:44/ 0 赞/ 202 阅读

相关矩阵翻硬币

问题描述　　小明先把硬币摆成了一个 n 行 m 列的矩阵。　　随后，小明对每一个硬币分别进行一次 Q 操作。　　对第x

ゝ一世哀愁。/ 2022年08月21日 05:44/ 0 赞/ 158 阅读

相关翻牌子

![这里写图片描述][SouthEast] <!DOCTYPE html> <html> <head> <meta c

- 日理万妓/ 2022年06月05日 09:06/ 0 赞/ 160 阅读

相关翻回北京

如果一个纽约人到北京工作，他一定会觉得非常不方便——不能上Facebook、Twitter和YouTube。不知道这算不算从互联网发达地区到欠发达地区“应有的”痛苦经历之一。

分手后的思念是犯贱/ 2022年04月03日 07:28/ 0 赞/ 159 阅读

相关翻页文字特效

@import url(https://fonts.googleapis.com/css?family=Lato:900); , :before, :after

快来打我*/ 2021年12月24日 00:23/ 0 赞/ 333 阅读

相关翻訳

違う言語環境のPG対応　それぞれの開発環境で関連するテキストシンボルなどの内容を編集する　Tr:SE63で関連するオブジェクトの翻訳内容を記入する(SAPのお気入り

谁践踏了优雅/ 2021年12月09日 15:05/ 0 赞/ 221 阅读

相关翻页

package mb.utils; import java.util.ArrayList; import java.util.List;

短命女/ 2021年09月23日 06:22/ 0 赞/ 422 阅读