Galleria JQuery плагин - PullRequest
Новая
       9

Galleria JQuery плагин

1 голос
/ 19 сентября 2010

Вот домашняя страница популярного jquery-плагина galleria .Мне нужно вставить ссылку на скачивание в правом нижнем углу для активного изображения.Теперь доступна статистика типа (3/10), которая указывает текущий номер из списка.Может быть, кто-то уже сделал это.Какой самый быстрый способ?

UPD: используя идею gearsdigital Я написал код: 

var gallery = Galleria.get(0);

gallery.bind(Galleria.IMAGE, function(e) {
    imgHandle = e.imageTarget;
    console.log(imgHandle);
    console.log(imgHandle.attr('href'));
    //$('.galleria-counter').append('<a href="'+imgHandle.attr('src')+'">Download</a>');
});

Первый журналстрока показывает что-то вроде: 

<img width="584" height="438" src="http://....jpg" style="display: block; position: relative; left: 0px; top: -4px; opacity: 1;">

Но как получить местоположение src, я вижу ошибку, что attr функция недоступна.

Ответы [ 2 ]

2 голосов
/ 19 сентября 2010

вы получаете imgHandle от DOMEvent, а не от объекта jquery.

Поскольку attr является частью объекта jQuery, вам нужно передать объект dom в объект jquery. 

gallery.bind(Galleria.IMAGE, function(e) {
    imgHandle = $(e.imageTarget); //Wrap it here

   alert(imghandle.attr('href'))

    //$('.galleria-counter').append('<a href="'+imgHandle.attr('src')+'">Download</a>');
});
1 голос
/ 19 сентября 2010

Я бы попытался получить текущий атрибут источника из текущего изображения и добавить его в качестве ссылки. 

//Untested. This is just a suggestion :)
currentImageSource = $('.galleria-image img').attr('src');  
$('.galleria-counter').append('<a href="'+currentImageSource+'">Download</a>');

Но такая ссылка откроет изображение отдельно, а не загрузит обычное. Если вы хотите «настоящую» загрузку, вы должны поместить это изображение в zip-архив. 

$('.galleria-counter').append('<a href="'+currentImageSource+'.zip">Download</a>');

Это даст что-то вроде этого: http://www.example.com/galleria/img/mygreatimage.jpg.zip

У меня работает: 

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Example</title>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>

        <script type="text/javascript">
            $(document).ready(function() {

                currentImageSource = $('.container img').attr('src');  
                $('.placeholder').append('<a href="'+currentImageSource+'">Download</a>');

            });

        </script>
    </head>

    <body>
        <div class="container">
            <h2>Get img src</h2>
            <img src="http://www.duba.at/wp-content/uploads/2007/08/bild_0570000.jpg" witdh="200" height="220"/>
        </div>

        <div class="placeholder">
            <h2>Append Here</h2>
        </div>

    </body>
</html>
...