JavaScript图片作为一个按钮（的onClick） [英] JavaScript image as a button (onClick)

问题描述

我在与JavaScript的一个小问题，不知道是否能帮助我。我有一个图像和视频。我希望能够点击图像并让视频半透明度。我不是很明白为什么我的code不起作用。

图片

 ＆LT; IMG SRC =詹姆斯Outlined.jpgID =picture_on＆GT;
 

的iFrame

 ＆LT; IFRAME WIDTH =630HEIGHT =350SRC =htt​​ps://www.youtube.com/embed/MmB9b5njVbAFRAMEBORDER =0的allowFullScreen ID = MinecraftVideo＆GT;＆LT; / IFRAME＆GT;
 

的JavaScript code

 ＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js＆GT;    $（文件）。就绪（函数（）{
    $（＃picture_on）。点击（函数（）{
    $（＃MinecraftVideo）。动画（{
    透明度：0.5
        }）;
      }）;
    }）;＆LT; / SCRIPT＆GT;
 

解决方案

您有一些JavaScript语法错误在你的codeS。

  

$（＃picture_on）

不要使用多字节字符作为分隔符。更改到或 ，直到使用权语法，你的code工作正常。选中此小提琴。

 ＆LT;脚本SRC =htt​​ps://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js＆GT;
$（文件）。就绪（函数（）{
    $（＃picture_on）。点击（函数（）{
        $（＃MinecraftVideo）。动画（{
            透明度：0.5
        }）;
    }）;
}）;
＆LT; / SCRIPT＆GT;
 

I'm having a little problem with JavaScript and wondered whether you could help me. I have an image and a video. I want to be able to click the image and to make the video at half transparency. I can't quite see why my code doesn't work.

Image

<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 code

<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>

解决方案

You have some JavaScript syntax error's in your codes.

$("#picture_on")

Don't use 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>

这篇关于JavaScript图片作为一个按钮（的onClick）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！