Question

我希望能够通过点击来改变div的不透明度。我写了下面的代码，但看起来opacity: 1s不起作用，不知道为什么？

<!DOCTYPE html>
<html>
<head>
    <style> 
        div {
            background-color: red;
            opacity: 0.1;
            filter: Alpha(opacity=50); /* IE8 and earlier */,
            transition: opacity 1s;
        }
    </style>
    <script>
        function changeOpacity() {
            document.getElementById("myDiv").style.opacity = 1;
        }
    </script>
</head>

<body>
    <div id ="myDiv"onclick="changeOpacity()">
        This element's opacity is 0.5! Note that both the text and the background-color are affected by the opacity level!
    </div>
</body>
</html>

Answer 1

我希望能帮到你，试试这个：

<!DOCTYPE html>
<html>
<head>
<style> 
    div {
        background-color: red;
        opacity: 0.1;
        filter: Alpha(opacity=50); /* IE8 and earlier */,
        transition: opacity 1s;
    }
</style>
</head>
<body>

<div id ="myDiv"onclick="changeOpacity()">This element's opacity is 0.5! Note that both the text and the background-color are affected by the opacity level!</div>
<script>
    function changeOpacity(){
       document.getElementById("myDiv").style.opacity = 1;
    }
</script>
</body>
</html>

javascript +不透明度转换不起作用

1 个答案: