有图像替换库希望单击时将大图像替换为视频

问题描述

|| 我有一个图片替换图库，当我单击缩略图时，主div中会出现一个较大的图片。我希望单击此图像并播放视频，我希望为每个单击的较大图像播放不同的视频。所有视频都在youtube上。 这是我到目前为止的代码和脚本：

    <div class=\"videogallery\">
    <img id=\"largeImg\" src=\"/images/locationbased_largeclicktoplay.jpg\" alt=\"location-based Video\" />
</div>
              <div><hr /></div>
 <div class=\"thumbnails\">
             <p style=\"font-size: 14px; font-weight:bold; color:#466ea9;font-family:\'Lucida Grande\',sans-serif; text-align:left; padding-bottom:10px;\">Videos</p>
             <p style=\" text-align:center;\">    
             <a href=\"/images/logo_largeclick.jpg\" title=\"Social Media 101 Video\">
             <img src=\"/images/logo_small.jpg\" border=\"0\" height=\"61\" width=\"100\" style=\"padding-right:10px;\" /></a> 
             <a href=\"/images/facebook_large.jpg\" title=\"Facebook Video\">
             <img src=\"/images/facebook_small.jpg\" border=\"0\" height=\"61\" width=\"100\" style=\"padding-right:10px;\"/></a> 
             <a href=\"/images/twitter_largeclicktoplay.jpg\" title=\"Twitter Video\">
             <img src=\"/images/twitter_small.jpg\"border=\"0\" height=\"61\" width=\"100\" style=\"padding-right:10px;\"/></a>
             <a href=\"/images/youtube_largeclicktoplay.jpg\" title=\"Youtube Video\">
             <img src=\"U/images/youtube_s.jpg\" border=\"0\" height=\"61\" width=\"100\" style=\"padding-right:10px;\"/></a>
  </div>

这是脚本：

<script type=\"text/javascript\"> 
$(document).ready(function(){


$(\".thumbnails a\").click(function(){

    var largePath = $(this).attr(\"href\");
    var largeAlt = $(this).attr(\"title\");

    $(\"#largeImg\").attr({ src: largePath,alt: largeAlt });

    $(\"h2 em\").html(\" (\" + largeAlt + \")\"); return false;
});

}）;   任何帮助深表感谢！ 谢谢。 -安     

解决方法

        我知道了，我添加了一个脚本

<script type=\"text/javascript\">
var embedCode = \'<object data=\"http://blip.tv/play/gYMo_vAmAA\" type=\"application/x-shockwave-flash\" height=\"500\" width=\"600\">
<param name=\"src\" value=\"http://blip.tv/play/gYMo_vAmAA\">
<param name=\"allowfullscreen\" value=\"true\"></object>\'
</script>

和

onclick

：

onclick=\"document.getElementById(\'videocontainer\').innerHTML = embedCode;\"

到

image

标签 我可能会为每个拇指邮件向脚本添加一个不同的变量。