2012-07-09 129 views
0

我试图让jquery滑块调用wmu滑块来工作。我已经从https://github.com/pastawoua/wmuSlider下载了文件和演示,当我在本地打开demo.html时,它应该可以正常工作,但是当我将其上传到我的网站时没有加载,这里是网址http://www.klossal.com/wmuSlider/demo/demo.htmlwmuSlider脚本适用于本地服务器,但不适用于远程服务器

我看了一切都多次,网址都是正确的,我一直试图解决这个问题好几个小时没有运气,任何帮助将非常感激。

对不起,如果联系不为你工作,这里是代码:

HTML:

<!DOCTYPE html> 

<!-- BEGIN html --> 
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"><![endif]--> 
<!--[if IE 7 ]><html class="ie ie7" lang="en"><![endif]--> 
<!--[if IE 8 ]><html class="ie ie8" lang="en"><![endif]--> 
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"><!--<![endif]--> 

<!-- BEGIN head--> 
<head> 

<!-- Meta Tags --> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum- 
scale=1.0"> 

<!-- Title --> 
<title>wmuSlider Demo</title> 

<!-- Stylesheets --> 
<link rel="stylesheet" href="css/demo.css" type="text/css" media="screen" /> 
<script type="text/javascript" src="modernizr.custom.min.js"></script>  
<script src="http://www.klossal.com/jquery-1.7.2.min.js"></script> 
<script src="../jquery.wmuSlider.js"></script> 
<script src="../jquery.wmuGallery.js"></script> 
<script> 
    $('.example1').wmuSlider(); 

    $('.example2').wmuSlider({ 
     touch: true, 
     animation: 'slide' 
    }); 

    $('.example3').wmuSlider({ 
     touch: Modernizr.touch, 
     animation: 'slide', 
     items: 2 
    }); 

    $('.example4').wmuGallery(); 
</script> 
<!-- END head --> 
</head> 

<!-- BEGIN body --> 
<body> 

<!-- BEGIN .wmuSlider --> 
<div class="wmuSlider example1"> 

    <div class="wmuSliderWrapper"> 
     <article> 
      <img src="http://www.klossal.com/media/boundarywaters/boundry-1.jpg" /> 
     </article> 

     <article> 
      <img src="http://www.klossal.com/media/boundarywaters/boundry-2.jpg" /> 
     </article> 

     <article> 
      <img src="http://www.klossal.com/media/boundarywaters/boundry-3.jpg" /> 
     </article> 

     <article> 
      <img src="http://www.klossal.com/media/boundarywaters/boundry-4.jpg" /> 
     </article> 

     <article> 
      <img src="http://www.klossal.com/media/boundarywaters/boundry-5.jpg" /> 
     </article> 

     <article> 
      <img src="http://www.klossal.com/media/boundarywaters/boundry-6.jpg" /> 
     </article> 
    </div> 

<!-- END .wmuSlider --> 
</div> 

<!-- BEGIN .wmuSlider --> 
<div class="wmuSlider example2"> 

    <div class="wmuSliderWrapper"> 
     <article> 
      <img src="http://farm7.static.flickr.com/6052/6279000273_218313c876.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6104/6271856202_1e3ccb3deb.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6053/6268322528_818ab33f7f.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6232/6239597762_15491d4c97.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6057/6224753006_9fb962d890.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6036/6213397745_1d8f223e93.jpg" /> 
     </article>    
    </div> 

<!-- END .wmuSlider --> 
</div> 

<!-- BEGIN .wmuSlider --> 
<div class="wmuSlider example3"> 

    <div class="wmuSliderWrapper"> 
     <article> 
      <img src="http://farm7.static.flickr.com/6052/6279000273_218313c876.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6104/6271856202_1e3ccb3deb.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6053/6268322528_818ab33f7f.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6232/6239597762_15491d4c97.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6057/6224753006_9fb962d890.jpg" /> 
     </article> 

     <article> 
      <img src="http://farm7.static.flickr.com/6036/6213397745_1d8f223e93.jpg" /> 
     </article> 
    </div> 

<!-- END .wmuSlider --> 
</div> 

<!-- BEGIN .wmuGallery --> 
<div class="wmuGallery example4"> 

    <div class="wmuSlider">   
     <div class="wmuSliderWrapper"> 
      <article> 
       <img width="75" height="75" 
src="http://farm7.static.flickr.com/6052/6279000273_218313c876_s.jpg" data-src- 
full="http://farm7.static.flickr.com/6052/6279000273_218313c876.jpg" /> 
      </article> 

      <article> 
       <img width="75" height="75" 
src="http://farm7.static.flickr.com/6104/6271856202_1e3ccb3deb_s.jpg" data-src- 
full="http://farm7.static.flickr.com/6104/6271856202_1e3ccb3deb.jpg" /> 
      </article> 

      <article> 
       <img width="75" height="75" 
src="http://farm7.static.flickr.com/6053/6268322528_818ab33f7f_s.jpg" data-src- 
full="http://farm7.static.flickr.com/6053/6268322528_818ab33f7f.jpg" /> 
      </article> 

      <article> 
       <img width="75" height="75" 
src="http://farm7.static.flickr.com/6232/6239597762_15491d4c97_s.jpg" data-src- 
full="http://farm7.static.flickr.com/6232/6239597762_15491d4c97.jpg" /> 
      </article> 

      <article> 
       <img width="75" height="75"  
src="http://farm7.static.flickr.com/6057/6224753006_9fb962d890_s.jpg" data-src- 
full="http://farm7.static.flickr.com/6057/6224753006_9fb962d890.jpg" /> 
      </article> 

      <article> 
       <img width="75" height="75" 
src="http://farm7.static.flickr.com/6036/6213397745_1d8f223e93_s.jpg" data-src- 
full="http://farm7.static.flickr.com/6036/6213397745_1d8f223e93.jpg" /> 
      </article> 
     </div> 
    </div> 

<!-- END .wmuGallery --> 
</div> 

<!-- Scripts --> 
<script type="text/javascript" src="modernizr.custom.min.js"></script>  
<script src="http://www.klossal.com/jquery-1.7.2.min.js"></script> 
<script src="../jquery.wmuSlider.js"></script> 
<script src="../jquery.wmuGallery.js"></script> 
<script> 
    $('.example1').wmuSlider(); 

    $('.example2').wmuSlider({ 
     touch: true, 
     animation: 'slide' 
    }); 

    $('.example3').wmuSlider({ 
     touch: Modernizr.touch, 
     animation: 'slide', 
     items: 2 
    }); 

    $('.example4').wmuGallery(); 
</script> 

<!-- END body --> 
</body> 
<!-- END html --> 
</html> 

有muliple JS文件,所以我将链接到他们的github上:

https://github.com/pastawoua/wmuSlider/blob/master/jquery.wmuGallery.js

https://github.com/pastawoua/wmuSlider/blob/master/jquery.wmuslider.js

https://github.com/pastawoua/wmuSlider/blob/master/demo/modernizr.custom.min.js

这里是CSS:

https://github.com/pastawoua/wmuSlider/blob/master/demo/css/demo.css

+0

(Ctrl + Shift + K)。你可以看到一个错误'registrar_frameset is not defined' – shashwat 2012-07-09 12:55:46

+2

这个链接对我不起作用。 – 2012-07-09 12:55:55

+0

发布您的代码。链接任何一种方式似乎都没有用,对未来的参考文献没有用 – ericosg 2012-07-09 12:56:25

回答

4

在这种情况下还没有(或将来搜索)解决,检查从GitHub下载的每个文件。看起来像包含sprites.png文件的每个文件都是demo.html文件的副本,当您右键单击并且将链接另存为时。

看看演示文件,并复制/粘贴。

1

capslock matter! 变化<script src="../jquery.wmuSlider.js"></script>

<script src="../jquery.wmuslider.js"></script> 

:)

在Firefox控制台
相关问题