Я хочу поместить мои изображения в <div> вместо массива изображений

0

То, что я хочу сделать, - это вместо изображений для JavaScript в пределах массива изображений. Я хотел бы, чтобы они были внутри div fadeshow1, но я не знаю, как это сделать.

Разметка:

<div id="fadeshow1">
<img src="image1">
<img src="image2">
<img src="image3"></div>

Код с массивом изображений:

<html>
    <head>
<script type="text/javascript">

var mygallery=new fadeSlideShow({
    wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
    dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
    imagearray: [
        ["http://www.dynamicdrive.com/dynamicindex4/pool.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
        ["http://www.dynamicdrive.com/dynamicindex4/cave.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
        ["http://www.dynamicdrive.com/dynamicindex4/fruits.jpg"],
        ["http://www.dynamicdrive.com/dynamicindex4/dog.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
    ],
    displaymode: {type:'auto', pause:2000, cycles:0, wraparound:false},
    persist: false, //remember last viewed slide and recall within same session?
    fadeduration: 500, //transition duration (milliseconds)
    descreveal: "ondemand",
    togglerid: ""
})

</script>
    </head>
    <body>

    <div id="fadeshow1"></div>

    </body>
</html>
  • 0
    почему вы не можете редактировать картинки в CSS ?
  • 0
    Вам понадобятся кавычки вокруг идентификатора вашего div
Теги:

1 ответ

0

JSFiddle для ленивых.

Здесь очень тупой вариант:

var myImages = [];

$("#fadeshow1 img").each(function(index, element){
    var $element      = $(element), 
        altText       = $element.attr('alt'),
        $parentLinkEl = $element.parent('a'),
        linkUrl,
        linkTarget;

    if ($parentLinkEl.length)
    {
        linkUrl    = $parentLinkEl.attr('href');
        linkTarget = $parentLinkEl.attr('target');
    }

    if (linkUrl === void 0)
    {
        linkUrl = '';
    }

    if (linkTarget === void 0)
    {
        linkTarget = '';
    }

    if (altText === void 0) {
        altText = '';
    }
    myImages.push([$element.attr('src'), linkUrl, linkTarget, altText]);
});

Применение:

<div id="fadeshow1">
    <img src="image1" alt="foo"/>
    <a href="http://google.de"><img src="image2"/></a>
    <a href="http://wikipedia.org" target="_top"><img src="image3" alt="bar" /></a>
</div>

Вывод:

[
    ["image1", ""                     ,""     , "foo"],
    ["image2", "http://google.de"     ,""     , ""],
    ["image3", "http://wikipedia.org" ,"_top" , "bar"]
] 

Ещё вопросы

Сообщество Overcoder
Наверх
Меню