脚本不是't创建跨度

这是我用来在图像下创建span以在悬停上显示背景图像的脚本

$(".gallery li a.image, .portfolio li a.image").append('<span class="image_hover"></span>'); //add span to images
        $(".gallery  li a.video, .portfolio li a.video").append('<span class="video_hover"></span>'); //add span to videos
        $('.gallery  li a span').css('opacity', '0').css('display', 'block') //span opacity = 0 
        // show / hide span on hover
        $(".gallery li a, .portfolio li a").hover(
             function () {
                 $(this).find('.image_hover, .video_hover').stop().fadeTo('slow', .7); }, 
            function () {
                  $('.image_hover, .video_hover').stop().fadeOut('slow', 0);
        });

这是css代码：

#gallery_prettyphoto.portfolio
{padding: 0 0 20px 0;
overflow: hidden;
}
#gallery_prettyphoto.portfolio ul li
{
display: inline-block;
height: 400px;
margin-bottom:35px;
}

#gallery_prettyphoto.portfolio ul li a img
{border: none; margin-top: 30px;}
/*#gallery_prettyphoto.portfolio:hover ul li a img {width: 120%;}*/
#gallery_prettyphoto.portfolio ul li h3 a
{text-decoration: none; text-align: center;}
 #gallery_prettyphoto.portfolio ul li p
 {margin: 10px 0 15px 0;}
 #gallery_prettyphoto.portfolio ul li a.more-link
 {-moz-border-radius: 3px; /* FF1-3.6 */
  -webkit-border-radius: 3px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
   border-radius: 3px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
border: 1px solid #2C2C2C;
background: #111111;
text-align: center;
padding: 3px 10px;
width: 80px;
display: block;
color: white;
text-decoration: none;}
 #gallery_prettyphoto.portfolio ul li a.more-link:hover
 {background: #222222;}
#gallery_prettyphoto.portfolio a span
{
z-index: 2000;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
cursor: pointer;
}
.portfolio .gallery_2columns a 
{position: relative;
display: block;}
.portfolio .gallery_3columns a 
{position: relative;
display: block;}
.portfolio .gallery_2columns a span.image_hover
{background: black url(images/gallery_hover/hover_image_big.png) no-repeat center center;
}

.portfolio .gallery_2columns a span.video_hover
{background: black url(images/gallery_hover/hover_video_big.png) no-repeat center center;
}
.portfolio .gallery_3columns a span.image_hover
{background: black url(images/gallery_hover/hover_image_medium.png) no-repeat center center;
}
.portfolio .gallery_3columns a span.video_hover
{background: black url(images/gallery_hover/hover_video_medium.png) no-repeat center center;
}

如果没有解决方案，你能指导我在悬停时创建类似的效果吗，比如缩放图像或改变不透明度。