Просмотр изображений с помощью YUI

Я создал страницу, на которой изображения Instagram отображаются в виде сетки. Когда я нажимаю на определенное изображение, открывается новая страница, показывающая это конкретное изображение из исходной ссылки Instagram. Я хочу, чтобы изображение открывалось на исходной странице, а не на любой новой странице, используя только Yahoo YUI. Пример здесь. (Под панелью_five). У меня нет опыта работы с YUI. Весь мой код: // он отображает 10 изображений в 10 разных полях.

$(function() {

 $.ajax({
        type: "GET",
        dataType: "jsonp",
        cache: false,
        url: "https://api.instagram.com/v1/media/popular?client_id=70fd1ce846d641928bf0a047053cf62d",
        success: function(data) {

            for (var i = 0; i < 10; i++) {
                $('.ttl').first().parent().append('<div class="ttl"><div class="ttlpadding"><div class="item">' + "<a href='" + data.data[i].images.standard_resolution.url +"' ><img src='" + data.data[i].images.thumbnail.url +"' /></a>" +"</div></div></div>");
            }     

        }
    });

});

person user188995    schedule 16.08.2012    source источник


Ответы (1)


У меня есть рабочий пример по адресу http://jsbin.com/welcome/12864/edit.

YUI().use('jsonp', 'node', function(Y) {
    var list = Y.one('#output');

    Y.jsonp(
        "https://api.instagram.com/v1/media/popular?client_id=70fd1ce846d641928bf0a047053cf62d&callback={callback}",
        function(data) {
            for (var i = 0; i < 10; i++) {
                list.append('<div class="ttl"><div class="ttlpadding"><div class="item">' + "<a href='" + data.data[i].images.standard_resolution.url +"' ><img src='" + data.data[i].images.thumbnail.url +"' /></a>" +"</div></div></div>");
            }
        }
    );
});

Как видите, на самом деле это не сильно отличается от примера с jquery. Вам не нужно будет загружать и размещать какие-либо файлы, если вы не используете свое приложение под SSL. Яху! не предоставляет комбинированный загрузчик на основе SSL, но его очень легко запустить самостоятельно под SSL.

person jshirley    schedule 16.08.2012