如何解决自定义javascript幻灯片元素出现问题主按钮无响应
我在将javascript幻灯片显示集成到我的Squarespace网站时遇到了一些麻烦。页面上的所有内容看起来都很好，但是用于查看幻灯片库的按钮没有响应。
我不确定javascript或css文件是否未正确链接？我通过头注入，站点范围内以及在单个页面本身上注入脚本和CSS，甚至尝试使用页脚。我试图在本地托管文件，但也尝试从实际的源网站上处理src文件，但都没有用。
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://tympanus.net/Development/ScatteredPolaroidsgallery/js/modernizr.min.js"></script>
<script src="//https://tympanus.net/Development/ScatteredPolaroidsgallery/js/photostack.js"></script>
<script src="//https://tympanus.net/Development/ScatteredPolaroidsgallery/js/classie.js" ></script>
<link rel="stylesheet" href="https://tympanus.net/Development/ScatteredPolaroidsgallery/css/component.css"/>
<link rel="stylesheet" href="https://tympanus.net/Development/ScatteredPolaroidsgallery/css/demo.css"/>
<link rel="stylesheet" href="https://tympanus.net/Development/ScatteredPolaroidsgallery/css/normalize.css"/>
<section id="photostack-1" class="photostack photostack-start">
<div>
<figure style="transform: translate(200px,200px) rotate(-16deg);">
<a href="img" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1589934385738-MXL1GUJ92IVZN0DEDXOL/ke17ZwdGBToddI8pDm48kPe5RiKppm9GG6ppTb_Faql7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHcclfrh8O1z5QHyNOqBUUEtDDsRWrJLTm0EJvx1ti9yXQ8tz8yvmwB9n_0euyg3xEuJeFkq2YFCnXL5lexUHVZRnE2OrpUbZC/astro?format=500w" alt="img04"></a>
<figcaption>
<h2 class="photostack-title">Astro</h2>
<div class="photostack-back">
<p>Sci Fi- Short Film.</p>
</div>
</figcaption>
</figure>
<figure style="transform: translate(360px,20px) rotate(-11deg);">
<a href="img11" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1589934475663-W46PFG3RJVBBJMTKP36O/ke17ZwdGBToddI8pDm48kPmLlvCIXgndBxNq9fzeZb1Zw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZamWLI2zvYWH8K3-s_4yszcp2ryTI0HqTOaaUohrI8PIFMLRh9LbupWL4Bv1SDYZc4lRApws2Snwk0j_RSxbNHMKMshLAGzx4R3EDFOm1kBS/fragmenteddreams?format=500w" alt="img05"></a>
<figcaption>
<h2 class="photostack-title">Fragmeented Dreamscapes</h2>
</figcaption>
</figure>
<figure data-shuffle-iteration="2" style="transform: translate(360px,380px) rotate(24deg);">
<a href="img3" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590138240444-N11DXMNU6PT1QWSR2XOL/ke17ZwdGBToddI8pDm48kBVDUY_ojHUJPbTAKvjNhBl7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHcclfrh8O1z5QHyNOqBUUEtDDsRWrJLTmmV5_8-bAHr7cY_ioNsJS_wbCc47fY_dUiPbsewqOAk2CqqlDyATm2OxkJ1_5B47U/AstroTeaser?format=500w" alt="img01"></a>
<figcaption>
<h2 class="photostack-title">Astro Teaser</h2>
<div class="photostack-back">
<p>Teaser</p>
</div>
</figcaption>
</figure>
<figure style="transform: translate(200px,-160px) rotate(18deg);">
<a href="img99" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1591166215066-5Z5Z1ZLC4RXREUG7915N/ke17ZwdGBToddI8pDm48kPtRZ3OyglXDuVt0f2hKzkxZw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZamWLI2zvYWH8K3-s_4yszcp2ryTI0HqTOaaUohrI8PIe9rtU8Gvg7TAs5vyBCaS2OgMHSRDLS_ROxGACNng4OMKMshLAGzx4R3EDFOm1kBS/votm?format=500w" alt="img02"></a>
<figcaption>
<h2 class="photostack-title">VOTM: Happiness</h2>
<div class="photostack-back">
<p>Documentary</p>
</div>
</figcaption>
</figure>
<figure data-shuffle-iteration="3" style="transform: translate(40px,20px) rotate(30deg);">
<a href="img293" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590138931244-86ALDDADTARYJEZSBCHH/ke17ZwdGBToddI8pDm48kBVDUY_ojHUJPbTAKvjNhBl7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHcclfrh8O1z5QHyNOqBUUEtDDsRWrJLTmuRu0Pfuf5F0yH2Y0n9Wb2uSXfk79yzklavJJ48t78dp27rAT2psOBuL_FmvkUhyS/SomethingAboutlove?format=500w" alt="img03"></a>
<figcaption>
<h2 class="photostack-title">Something About love</h2>
</figcaption>
</figure>
<figure data-shuffle-iteration="2" style="transform: translate(-120px,200px) rotate(-1deg);">
<a href="img1" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590140420704-6U1QZXZD4EQG7HYERP1L/ke17ZwdGBToddI8pDm48kBd2ZI0C_2Vnzz7G8X3m5-0UqsxRUqqbr1mOJYKfIPR7LoDQ9mXPOjoJoqy81S2I8N_N4V1vUb5AoIIIbLZhVYxCRW4BPu10St3TBAUQYVKcl_UWDHYh_IdE-775gCeAieDvP1eLt0Tq8Wozg89XLEiCtQgz8i36nHhY7a_IcOjR/analogfantasy?format=500w" alt="img06"></a>
<figcaption>
<h2 class="photostack-title">Analog Fantasy</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(360px,200px) rotate(35deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590146134911-LD2AAWY16Q980K51528H/ke17ZwdGBToddI8pDm48kCPjJEwVxoWu-a6fDO2tahlZw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZUJFbgE-7XRK3dMEBRBhUpze_Z4sdv8hB8zEChgnI12DtbFgBqcamF6hCjCZbNhJg7A7Vo3M9FKy7w1-yY0so-A/snap?format=500w" alt="img07"></a>
<figcaption>
<h2 class="photostack-title">Snap</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(40px,200px) rotate(18deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590141450252-108YRC6E9WJT8SRB10CM/ke17ZwdGBToddI8pDm48kKgZtcdlUes5P2L9YJKMNR9Zw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZamWLI2zvYWH8K3-s_4yszcp2ryTI0HqTOaaUohrI8PI2do-h5XTUtMqWoz33tEUzyli8rEcalX0VCIynkzrz10KMshLAGzx4R3EDFOm1kBS/Spaces?format=500w" alt="img08"></a>
<figcaption>
<h2 class="photostack-title">Spaces</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(-120px,20px) rotate(-13deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590141702876-ZAXMKQ5UL3D3DONFKGPP/ke17ZwdGBToddI8pDm48kBVDUY_ojHUJPbTAKvjNhBl7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHcclfrh8O1z5QHyNOqBUUEtDDsRWrJLTmmV5_8-bAHr7cY_ioNsJS_wbCc47fY_dUiPbsewqOAk2CqqlDyATm2OxkJ1_5B47U/Verve?format=500w" alt="img09"></a>
<figcaption>
<h2 class="photostack-title">Verve</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(200px,380px) rotate(24deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590142848285-J4N79CPF2FJ1TTW6YZWM/ke17ZwdGBToddI8pDm48kBVDUY_ojHUJPbTAKvjNhBl7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHcclfrh8O1z5QHyNOqBUUEtDDsRWrJLTmmV5_8-bAHr7cY_ioNsJS_wbCc47fY_dUiPbsewqOAk2CqqlDyATm2OxkJ1_5B47U/2015?format=500w" alt="img10"></a>
<figcaption>
<h2 class="photostack-title">2015</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(40px,-160px) rotate(-27deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590143190384-MBEOYVNE8BD8QNFSB1YD/ke17ZwdGBToddI8pDm48kKyAC95JBJFAHkOhaWLMhegUqsxRUqqbr1mOJYKfIPR7LoDQ9mXPOjoJoqy81S2I8N_N4V1vUb5AoIIIbLZhVYxCRW4BPu10St3TBAUQYVKcMrw2Lzx3vZZ2SRyPKp_cy8Fa903fvwYgupJ5zY56wUUeUlUEtR9yBq459QlM-TTV/Retro?format=500w" alt="img11"></a>
<figcaption>
<h2 class="photostack-title">Retro</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(360px,-160px) rotate(-16deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590144058387-WIH5KKL2OCRLCB9FY2V8/ke17ZwdGBToddI8pDm48kKyAC95JBJFAHkOhaWLMhegUqsxRUqqbr1mOJYKfIPR7LoDQ9mXPOjoJoqy81S2I8N_N4V1vUb5AoIIIbLZhVYxCRW4BPu10St3TBAUQYVKcMrw2Lzx3vZZ2SRyPKp_cy8Fa903fvwYgupJ5zY56wUUeUlUEtR9yBq459QlM-TTV/kairos?format=500w" alt="img12"></a>
<figcaption>
<h2 class="photostack-title">Kairos</h2>
</figcaption>
</figure>
<figure data-dummy="" style="transform: translate(200px,200px) rotate(9deg);">
<a href="#" class="photostack-img"><img src="https://images.squarespace-cdn.com/content/v1/529b047ce4b069bc9bedcff4/1590145327146-COJS2MK0SHSO6F03K5XW/ke17ZwdGBToddI8pDm48kAEJrbsFhWLqsgpoQx73qC1Zw-zPPgdn4jUwVcJE1ZvWQUxwkmyExglNqGp0IvTJZUJFbgE-7XRK3dMEBRBhUpyf-i7HqzWRj6Qnixywj4DB-I0eaifeuR6DviqjBRr8uBbu3jqDLNXNrXP7XxnmM3k/Aliment?format=500w" alt="img13"></a>
<figcaption>
<h2 class="photostack-title">Aliment</h2>
</figcaption>
</figure>
</div>
<nav><span></span><span></span><span></span><span></span><span></span><span></span></nav></section>
很想知道我做错了什么，以及如何学会解决这个问题。谢谢您的帮助！
解决方法
尝试从以下各行的开头删除//：
lyrics = oldMacdonald() + "And on his farm he had a " + animal + ",Ee-igh,Oh!\n" \
"With a " + sound[0] + "," + sound[1] + " here and a " + sound[2] + "," \
"" + sound[3] + ".\nHere a " + sound[4] + ",there a " + sound[5] + "," \
"everywhere a " + sound[6] + "," + sound[7] + "\n" + oldMacdonald()
这防止了这2个文件的加载。
,好吧，看起来该网站正在阻止JS / CSS文件的请求，因此您需要在本地加载它们。
您还需要在</body>结束标记之前添加以下javascript。
<script>
new Photostack( document.getElementById( 'photostack-1' ),{
callback : function( item ) {
//console.log(item)
}
});
</script>
我下载了项目源代码，并从上方将其粘贴到HTML中，并且可以正常工作。
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
