我正在寻找3D旋转木马(如http://www.professorcloud.com/mainsite/carousel.htm)然而我需要它以允许每张图像都有相应按钮的图像。
例如:
<ul><li><img><fb:like></li>
<li><img><fb:like></li>
<li><img><fb:like></li>
<li><img><fb:like></li>
<li><img><fb:like></li></ul>
我需要一个产品轮播,每个人都需要相应的Facebook 赞按钮。似乎当我在上面的旋转木马中添加除直线图像之外的内容时功能会中断!请告诉我这是否可行,或者我是否需要回到创意团队并说不可能(我猜测是因为大小调整按钮的数学可能会破坏)。
或者即使对焦的最前端汉堡然后在前面显示它的FB Like按钮。我可以使用上面的一个插件吗?教授云版本似乎没有“返回”返回哪个项目在前面。我有初级到中级jQuery知识。 ;)谢谢!
答案 0 :(得分:0)
输入正式答案,云端转盘有这行代码,根据前面的图像更改标题:
$(options.titleBox).html( $(items[fIndex].image).attr('title'));
以此为基础,我将页面的URL放在轮播中每个img的'data-url'属性中
<img src='img/myimage.png' data-url='fb-page-name'>
然后在轮播js中使用这行代码在showFrontText函数中动态添加FB Like按钮:
$("p.like").html('<iframe src=\"http:\/\/www.facebook.com\/plugins\/like.php?href=http://www.facebook.com/'+$(items[fIndex].image).attr('data-url')+'&layout=button_count&show_faces=false&width=80&action=like&font=arial&colorscheme=light\" scrolling=\"no\" frameborder=\"0\" style=\"border:none; overflow:hidden; width:80px; height:80px\" allowTransparency=\"true\"><\/iframe>');