Question

我正在开发一个用于计算Freight的小部件。我创建了两个div。当我们点击一个div时，它的显示属性设置为无，并且另一个div的显示属性设置为阻止。我面临着设置动画或转换到第二个div的问题，如联系我们并在博客上关注小部件。

<style>
#div1
{
    display : block;
    width : 150px;
    height : 50px; 
    background-color  : black;

}

#div2
{
    widht : 150px;
    height : 300px;
    display : none;

}
</style>

<body>


<div id = "div1">

</div>
<div id="div2">

</div>
</body>

点击处理程序

var div1=document.getElementById('div1');
var div2=document.getElementById('div2');

document.getElementById("div1").addEventListener("click",function(){


            if (div1 !== undefined && div2 !== undefined ) 
            {
                div1.style.display = div2.style.display === '' ? 'none' : div2.style.display === 'none' ? 'none' : 'block';

                div2.style.display = div1.style.display === 'block' ? 'none' : 'block';

            }
        });
        document.getElementById("div2").addEventListener("click",function(){


            if (div1 !== undefined && div2 !== undefined) 
            {
                div2.style.display = div1.style.display === '' ? 'none' : div1.style.display === 'none' ? 'none' : 'block';
                                div1.style.display = div2.style.display === 'block' ? 'none' : 'block';


            }

        });

我在两者上都设置了一个onclick事件。所以我帮助我使用onclick事件设置动画或转换效果。如果有人拥有完整的小部件代码，请与我分享，这将对我非常有帮助。

如何在div段上给动画效果onclick事件？

0 个答案: