在博客中实现视差滑块

Question

我正在尝试使用javascript在我的博客中添加一个视差滑块。

在我为实现这一目标而进行的研究中，我遇到了关于将滑块包含在博客中的tutorial。我按照给出的程序使用本教程实现了一个不同的滑块（Mary Lou的Parallax滑块）。该zip文件包含三个javascript文件，但我在博客模板中仅引用了其中一个（在google网站的页面上上传）。接下来我添加了css，将导航图像和背景图像上传到博客并提取了他们的链接，最后我添加了我在下面引用的html：

<div id="pxs_container" class="pxs_container">
<div class="pxs_bg">
    <div class="pxs_bg1"></div>
    <div class="pxs_bg2"></div>
    <div class="pxs_bg3"></div>
</div>
<div class="pxs_loading">Loading images...</div>
<div class="pxs_slider_wrapper">
    <ul class="pxs_slider">
        <li><img src="http://3.bp.blogspot.com/-ytZq9IQR2pA/Ucfbyp3gqII/AAAAAAAAACg/FrLRuE8lsGY/s1600/1.jpg" alt="First Image" /></li>
        <li><img src="http://1.bp.blogspot.com/-GOiswNwepaA/UcfbxPrx0yI/AAAAAAAAACY/orZUpjDa8_8/s1600/2.jpg" alt="Second Image" /></li>
        <li><img src="http://3.bp.blogspot.com/-tkqv4l0OW-o/UcfbvyPcA_I/AAAAAAAAACQ/SdsW2kEmRrE/s1600/3.jpg" alt="Third Image" /></li>
        <li><img src="http://2.bp.blogspot.com/-9sWga6Z1-b4/UcfbupMObgI/AAAAAAAAACI/NNH4v7GoWPs/s1600/4.jpg" alt="Fourth Image" /></li>
        <li><img src="http://3.bp.blogspot.com/-mQV4AV6cuxA/UcfbtqN14WI/AAAAAAAAACA/Jjn7RKmpDrs/s1600/5.jpg" alt="Fifth Image" /></li>
         <li><img src="http://1.bp.blogspot.com/-3Ldx-SSb8So/UcfbsuOUCyI/AAAAAAAAAB0/LiI3qwOi90Q/s1600/6.jpg" alt="Sixth Image" /></li>
                </ul>
    <div class="pxs_navigation">
        <span class="pxs_next"></span>
        <span class="pxs_prev"></span>
    </div>
    <ul class="pxs_thumbnails">
        <li><img src="http://3.bp.blogspot.com/-ytZq9IQR2pA/Ucfbyp3gqII/AAAAAAAAACg/FrLRuE8lsGY/s1600/1.jpg" alt="First Image" /></li>
        <li><img src="http://1.bp.blogspot.com/-GOiswNwepaA/UcfbxPrx0yI/AAAAAAAAACY/orZUpjDa8_8/s1600/2.jpg" alt="Second Image" /></li>
        <li><img src="http://3.bp.blogspot.com/-tkqv4l0OW-o/UcfbvyPcA_I/AAAAAAAAACQ/SdsW2kEmRrE/s1600/3.jpg" alt="Third Image" /></li>
        <li><img src="http://2.bp.blogspot.com/-9sWga6Z1-b4/UcfbupMObgI/AAAAAAAAACI/NNH4v7GoWPs/s1600/4.jpg" alt="Fourth Image" /></li>
        <li><img src="http://3.bp.blogspot.com/-mQV4AV6cuxA/UcfbtqN14WI/AAAAAAAAACA/Jjn7RKmpDrs/s1600/5.jpg" alt="Fifth Image" /></li>
        <li><img src="http://1.bp.blogspot.com/-3Ldx-SSb8So/UcfbsuOUCyI/AAAAAAAAAB0/LiI3qwOi90Q/s1600/6.jpg" alt="Sixth Image" /></li>

    </ul>
</div>

我期待几张图片和滑动效果，但它只是永远加载，如下面的屏幕截图所示

现场网站可以在这里看到：http://a-mouthful-of-recipes-about-us.blogspot.in/。

我不确定我的html错过了什么，我需要包含哪些内容以确保图片和滑块出现？