【问题标题】:javascript onclick changes stylesjavascript onclick 改变样式
【发布时间】:2015-01-05 18:31:45
【问题描述】:

我的图片动画很少,我想将光标更改为默认值(在图片上),在动画开始后,如果你尝试我的动画,你会看到在 onclick 功能之后你仍然有光标:图片上的指针。但我希望在动画之后有默认值。

我的小提琴:http://jsfiddle.net/1u6kbz7q/

HTML

                            <div id="facebook_text">
                                <a href="https://www.facebook.com/rostislav.danko" alt="facebook" target="_blank">Odkaz</a>
                            </div>
                            <div id="facebook_image">
                                <img class="facebook_animation" src="facebook.jpg"></img>
                            </div>
                        <script src="facebook_animation.js" type="text/javascript"></script>

CSS

#facebook_text {
    display: none;
}
#facebook_text a {
    position: absolute;
    font-size: 15px;
    text-decoration: none;
    margin-left: 50px;
    margin-top: 35px;
    z-index: 1;
}
#facebook_text a:hover {
    color: #e5e500;
}
#facebook_image.fly {
    position: absolute;
    margin-left: 125px;
    margin-top: 0px;
    transition: ease-in-out 1s;
}
#facebook_image img {
    position: absolute;
    z-index: 10;    
    height: 35px;
    width: 35px;
    margin-top: 25px;
    transition: ease-in-out 1s;
    cursor: pointer;
}

javascript

document.querySelector('.facebook_animation').onclick=function() {
        var d = document.getElementById("facebook_image");
        d.className = d.className + " fly";
            d.style.cursor = 'default';
        var t = document.getElementById("facebook_text");
        var delayed = setTimeout(function() {
            t.style.display = 'block';
        }, 500);
    }

【问题讨论】:

标签: javascript html css onclick var


【解决方案1】:

在那个光标问题上不需要涉及 JS:http://jsfiddle.net/1u6kbz7q/3/ 您已经添加了.fly,因此只需在 CSS 中定位 .fly 的图像

#facebook_image.fly img{
    cursor: default;
}

&lt;img&gt; 也是一个自闭合标签。无需使用结束&lt;/img&gt;

【讨论】:

    猜你喜欢
    • 2016-10-24
    • 2011-10-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-10-27
    • 2016-05-21
    • 2016-01-19
    • 1970-01-01
    相关资源
    最近更新 更多