php masonry,使用Masonry,jQuery和PHP制作专辑封面库

我读到了关于砌体的事情,并且在未能将图像附加到工作后,建议切换到继承人Isotope.我试图在专辑封面库中改进或创建变体,这是我在使用相同的

PHP类之前做过一两次的事情.

我可以使用基本功能,但单击添加更多图像的按钮始终无法正常工作.我一直在阅读jQuery文档,并且我尝试了各种JavaScript调试器,但是当我点击时,我总是最终没有将图像添加到我的库中.

为了获得最佳外观,绝对需要试错.

最大的专辑封面似乎是500像素,API中最小的是75,选择正确的列宽帮助.我目前正在使用75但50可能效果更好.我只想将图像添加到工作中并完成这个小实验.

我想尝试类似于这个technique of appending more images to the bottom的东西.我想附加更多的专辑封面,我使用PHP从各种API(亚马逊产品API,Last.fm,iTunes)中获取.所有专辑封面都来自API,我使用PHP查找给出专辑标题和艺术家的URL.我的代码正在运行:http://www.muschamp.ca/Muskie/cdCoverGalleryV4.php

我已多次更改CSS规则,现在我只有Isotope作者建议的默认CSS.

PHP代码循环并产生10个div,每个div有一个图像

$myAlbumCollection->randomMember();

$count = 0;

print('

');

while ( $count < 10 )

{

// Check that current album is in Amazon

$buyLink = $myAlbumCollection->currentAlbumAmazonProductURL();

$imageURL = $myAlbumCollection->currentAlbumRandomImageURL();

if ( (strcmp($buyLink, '#') != 0) && (strcmp($imageURL, myInfo::MISSING_COVER_URL) != 0))

{

$count++;

print('

');

print('');

print(''%20.%20%24imageURL%20.%20'');

print('');

print('

');

}

$myAlbumCollection->goToNextAlbum(); // This could loop forever if it doesn't find enough album covers, but in reality will timeout

}

print('

');

最后这里是javascript,最后一个问题就在这里:

$(function(){

var $container = $('#container');

$('#insert a').click(function(){

var $newEls = $.get('./moreAlbumCovers.php');

$container.isotope( 'insert', $newEls );

return false;

});

$container.isotope({

itemSelector: '.item',

masonry: {

columnWidth: 75

}

});

});

单击时会调用该链接,我已逐步完成. PHP生成DIVs As和IMG标签.我真的不确定我做错了什么,重复阅读文档并没有解决它.我从来都不是一个JavaScript家伙.我甚至不是一个PHP家伙,看起来是正确的,但是尽管慷慨的帮助和提供赏金,但是反复努力使它成功.

谢谢您的帮助.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值