JavaScript 图像作为按钮 (onClick)

Question

我在使用 JavaScript 时遇到了一点问题，想知道您是否可以帮助我。我有一张图片和一段视频。我希望能够单击图像并使视频半透明。我不太明白为什么我的代码不起作用。

图片

<img src="James Outlined.jpg" id="picture_on">

iFrame

<iframe width="630" height="350" src="https://www.youtube.com/embed/MmB9b5njVbA" frameborder="0" allowfullscreen id="MinecraftVideo"></iframe>

JavaScript代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">

    $(document).ready(function(){
    $(“#picture_on”).click(function(){
    $(“#MinecraftVideo”).animate({
    opacity: '0.5'
        });
      });
    });

</script>

Answer 1

您的代码中有一些 JavaScript 语法错误。

$(“#picture_on”)

不要使用 multibyte characters as delimiters. Change ” to " or '. Until using the right syntax, your code is working fine. Check this Fiddle。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
$(document).ready(function(){
    $("#picture_on").click(function(){
        $("#MinecraftVideo").animate({
            opacity: '0.5'
        });
    });
});
</script>

Answer 2

JavaScript 图像作为按钮：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $("#picture_on").click(function(){
            $("#MinecraftVideo").animate({
                opacity: '0.5'
            });
        });
    });
</script>

JavaScript 图像作为按钮 (onClick)

JavaScript image as a button (onClick)

javascript

jquery

image

button

图片

iFrame

JavaScript代码