Javascript 图像库使第一个图像变大

Javascript 图像库使第一个图像变大,javascript,jquery,html,css,image,Javascript,Jquery,Html,Css,Image,我在教程中制作了一个旋转图像,我希望第一个图像是大的,当我单击“下一步”时,下一个图像将显示在大div上,当图像被单击时,图像将显示在大div中。我尝试过类似的方法 $("bigimage_container").ready(function() { document.getElementById("bigimage_container").style.background = 'url('+ +') '; document.getElement

我在教程中制作了一个旋转图像,我希望第一个图像是大的,当我单击“下一步”时,下一个图像将显示在大div上,当图像被单击时,图像将显示在大div中。我尝试过类似的方法

$("bigimage_container").ready(function() {
            document.getElementById("bigimage_container").style.background = 'url('+  +') ';
            document.getElementById("bigimage_container").style.backgroundPosition = "center center";
            document.getElementById("bigimage_container").style.backgroundRepeat = "no-repeat";
            document.getElementById("bigimage_container").style.backgroundSize = "100% 100%";
        });
但我的问题是如何获得url或第一张图片,然后我想到了这个

$('#carousel_ul li:first').each(function() {
        alert($(this).attr('src'))
        });
但是当警报显示为未定义时,请提供任何帮助解释如何制作或提供教程将非常棒如果你知道如何制作这样的图库将非常棒在apple store中制作这样的图库真的很酷

更新: html

<div id="bigimage_container"></div>
        <div id='carousel_container'>
          <div id='left_scroll'><img src='left.png' /></div>
            <div id='carousel_inner'>
                <ul id='carousel_ul'>
                    <li><a href='#'><img src='1.png' /></a></li>
                    <li><a href='#'><img src='2.png' /></a></li>
                    <li><a href='#'><img src='3.png' /></a></li>
                    <li><a href='#'><img src='4.png' /></a></li>
                    <li><a href='#'><img src='5.png' /></a></li>
                </ul>
            </div>
          <div id='right_scroll'><img src='right.png' /></div>
          </div>


img标签在li内部,因此您必须通过以下方式获取:

 alert($('#carousel_ul li:first img').attr("src"));
$("#bigimage_container").css("background-image","url('"+$('#carousel_ul li:first img').attr("src")+"')")

您可以通过以下方式将其设置为div:

 alert($('#carousel_ul li:first img').attr("src"));
$("#bigimage_container").css("background-image","url('"+$('#carousel_ul li:first img').attr("src")+"')")


根据Ehsan Sajjad爵士的回答,这对我来说很有效,而且li没有src属性。我不知道这一点,等等,我会编辑帖子警报工作,但我如何将其作为背景或使其在div中变大,这是主要问题,先生。我试着将其放入
document.getElementById(“bigimage\u容器”)中.style.background='url(+')但它不起作用,这是一个非常宽泛的问题,你问的是如何制作画廊吗?问题是你问的是如何制作画廊不,我已经制作了画廊,先生,我正在尝试的是使画廊的第一张图片像画廊上方的一个大div的背景一样大……我将投票表决我的答案,因为我张贴了它在您编辑之前,感谢您的想法@EhsanSajjad