如何与图像从IMG元素

改变身体的背景我有，这是隐藏一些图像，标记是如何与图像从IMG元素

<div class="images hide"> 
    <img id="barber" class="barber-image" src="../../Content/images/chosing_business_role/barberShopBackground.jpg" /> 
    <img id="beauty" src="../../Content/images/background_image.png" /> 
</div>

，我需要改变身体的背景与他们的第一个图像加载时，但没有对该映像的服务器的新请求。我怎样才能做到这一点？谢谢。

来源

2015-06-09 Ihor Korotenko

只需使用JavaScript来与第一影像交换的背景图像。由于图片刚加载完毕，不会有额外的请求，数据应该来自浏览器的缓存。 – Paul

$('#barber').on('load', changeBodyBackground); 
// when image loads, call function 

.... 

function changeBodyBackground(e){ 
    $('body').css('background-image', $(this).attr('src')); 
    // set background-image property for body 
}

来源

2015-06-09 11:57:09 Nermin

你确定这个工作正常吗？它没有为我工作 – Newinjava

@Newinjava，它的工作。我认为浏览器关心缓存图像。在我的情况下，我在隐藏的div元素中有12个大图像（img标签），并且当我更改主体的背景时，一旦它全部加载，就没有对服务器的额外请求。我现在使用Chrome。 –

我只是好奇的语法。因为这个语法对我来说不起作用。 – Newinjava

试试这个

<!DOCTYPE html> 
<html> 
<head> 
    <script src = "jquery-1.10.2.min.js"></script> 
    <style> 
     .hide{display:none;} 
    </style> 
</head> 
<body> 
    <div class="images hide"> 
     <img id="barber" class="barber-image" src="1.jpg" /> 
      <img id="beauty" src="2.jpg" /> 
    </div> 
    <script type="text/javascript"> 
     $('body').css('background','url('+$('#barber').attr('src')+')'); 
    </script> 
</body> 
</html>

你也可以使用背景图片

$('body').css('background-image','url('+$('#barber').attr('src')+')');

来源

2015-06-09 12:21:38 Newinjava

如何与图像从IMG元素

回答

相关问题