我正在重复使用这段代码:
$(function () {
'use strict';
// Load demo images from flickr:
$.ajax({
url: (window.location.protocol === 'https:' ?
'https://secure' : 'http://api') +
'.flickr.com/services/rest/',
data: {
format: 'json',
method: 'flickr.interestingness.getList',
api_key: ''
},
dataType: 'jsonp',
jsonp: 'jsoncallback'
}).done(function (result) {
var
linksContainer = $('#links'),
baseUrl;
// Add the demo images as links with thumbnails to the page:
$.each(result.photos.photo, function (index, photo) {
baseUrl = 'http://farm' + photo.farm + '.static.flickr.com/' +
photo.server + '/' + photo.id + '_' + photo.secret;
$('<a/>')
.append($('<img>').prop('src', baseUrl + '_s.jpg'))
.hide()
.fadeIn('slow')
.prop('href', baseUrl + '_b.jpg')
.prop('title', photo.title)
.attr('data-gallery', '')
.appendTo(linksContainer);
});
});
});
这使他的工作变得肮脏,但我只对整个“照片墙”(它们大约是50)有效,相反,我认为每个单张照片jquery都会应用淡化效果。
谢谢大家!
答案 0 :(得分:1)
试试这个
$(function () {
'use strict';
// Load demo images from flickr:
$.ajax({
url: (window.location.protocol === 'https:' ?
'https://secure' : 'http://api') +
'.flickr.com/services/rest/',
data: {
format: 'json',
method: 'flickr.interestingness.getList',
api_key: ''
},
dataType: 'jsonp',
jsonp: 'jsoncallback'
}).done(function (result) {
var
linksContainer = $('#links'),
baseUrl;
// Add the demo images as links with thumbnails to the page:
$.each(result.photos.photo, function (index, photo) {
baseUrl = 'http://farm' + photo.farm + '.static.flickr.com/' +
photo.server + '/' + photo.id + '_' + photo.secret;
$('<a/>')
.append($('<img>').prop('src', baseUrl + '_s.jpg'))
.hide()
//.fadeIn('slow')
.prop('href', baseUrl + '_b.jpg')
.prop('title', photo.title)
.attr('data-gallery', '')
.appendTo(linksContainer);
});
setTimeout(function(){ showImg($('#links a:first'))}, 1000);
});
});
function showImg(el)
{
el.fadeIn('slow');
if(el.next().is('a'))
{
setTimeout(function(){ showImg(el.next())}, 1000);
}
}