Question

将鼠标悬停在图像上方按钮出现 HTML

<div class="block-11 block-1">
        <div class="carousel-wrapper" id="carousel-1">
            <ul class="carousel clearfix">
                <li>
                    <a href="img/img_8.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_8.jpg" alt="" width="646" height="350">                       
                    </a>
                </li>
                <li>
                    <a href="img/img_9.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_9.jpg" alt="" width="646" height="350">                       
                    </a>
                </li>
                <li>
                    <a href="img/img_10.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_10.jpg" alt="" width="646" height="350">                      
                    </a>
                </li>
                <li>
                    <a href="img/img_8.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_8.jpg" alt="" width="646" height="350">                       
                    </a>
                </li>
                <li>
                    <a href="img/img_9.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_9.jpg" alt="" width="646" height="350">                       
                    </a>
                </li>
                <li>
                    <a href="img/img_10.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_10.jpg" alt="" width="646" height="350">                      
                    </a>
                </li>
            </ul>
            <div class="semitransparentoverlay">
                <input name="" type="button" value="Смотреть все фото" class="btn-1">
            </div>
        </div>
    </div>

http://jsfiddle.net/1po0acv6/5/

有没有办法在单击按钮时将图像下载到Lightbox？

Answer 1

图像不会被下载＆＃34;点击按钮上的灯箱，你必须在＆lt; ul; class =＆＃39; carousel clearfix＆＃34;＆＃39;的innerHTML中添加图片，我的意思是＆＃39; li＆＃39的HTML ;包括它的孩子＆＃39; a＆＃39;并且＆＃39; img＆＃39;。然后重新初始化灯箱。

像这样：

jQuery('#button').click(function(){
    $('ul.carousel').html('<li>
                    <a href="img/img_10.jpg" data-lightbox="gallery-1" data-title="">
                        <img src="img/img_10.jpg" alt="" width="646" height="350">                      
                    </a>
                </li>');
    //now code lightbox reinitialization, according to the library you are using
});

祝你好运：）

按钮点击启动灯箱

1 个答案: