添加一个ID到div里的背景图片

我想添加一个id到div里面的背景图片，以便在加载时淡入。添加一个ID到div里的背景图片

<div class="thumbnail" style="background-image:url(images/bracelets/1/002.png,); width:356px; height:265px;"><a id="thumbnail-btn" href="images/bracelets/1/002a.png" rel="lightbox" title="my caption"></a></div>

这是我对我的代码，我想添加一个id是什么：

background-image:url(images/bracelets/1/002.png,)

我在页面上，我想在淡入几个背景图片同一时间。任何人都可以帮助我，或者告诉我是否可以添加一个id给它。因为这是我想使用淡入代码。

document.write("<style type='text/css'>#thephoto {visibility:hidden;}</style>"); 

var images = [ "thephoto1", "thephoto2", "thephoto3" ]; 
function initImages() { 
    for (var i = 0; i < images.length; i++) { 
     imageId = images[i]; 
     image = document.getElementById(imageId); 
     setOpacity(image, 0); 
     image.style.visibility = "visible"; 
     fadeIn(imageId, 0); 
    } 
} 
function fadeIn(objId,opacity) { 
    if (document.getElementById) { 
     obj = document.getElementById(objId); 
     if (opacity <= 100) { 
      setOpacity(obj, opacity); 
      opacity += 10; 
      window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100); 
     } 
    } 
} 
function setOpacity(obj, opacity) { 
    opacity = (opacity == 100)?99.999:opacity; 
    // IE/Win 
    obj.style.filter = "alpha(opacity:"+opacity+")"; 
    // Safari<1.2, Konqueror 
    obj.style.KHTMLOpacity = opacity/100; 
    // Older Mozilla and Firefox 
    obj.style.MozOpacity = opacity/100; 
    // Safari 1.2, newer Firefox and Mozilla, CSS3 
    obj.style.opacity = opacity/100; 
} 
window.onload = function() {initImage()} 
// --> 
</script>

如果任何人有如何做到这一点我真的很感激它一个更好的主意！

谢谢！ S.

来源

2011-03-02 Sophie

uset jQuery'fadeIn'，'fadeOut' method – diEcho 2011-03-02 06:32:09

你不能把一个ID的背景图片上。你通过它的bg之类的ID来引用它。如果你想做这个工作，它会采取一些巧妙的布局。让divs坐在彼此的顶部，这样你可以清楚地看到顶部，最下面的部分可以淡入淡出。是的，正如farligOpptreden所说，使用jquery。会让你的生活更轻松。

来源

2011-03-02 06:36:08 lupos

你应该考虑使用jQuery来设置不透明度。它为您处理所有跨浏览器兼容性问题...... jQuery中还有一个淡入淡出功能，因此您可以将其应用于页面上的所有“缩略图”分类DIV。

一个例子可能是如下：

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("div.thumbnail").fadeIn("slow",function(){ 
    // do something when the items have faded in 
    }); 
}); 
</script>

来源

2011-03-02 06:33:38 FarligOpptreden

添加一个ID到div里的背景图片

回答

相关问题