我正在尝试在项目中使用slider pro。但是,我在提起它时遇到了麻烦。
我去了控制台并且告诉我变量没有定义。 我将向您展示如何在Git上发布页面,以及我是如何完成它的。
您可以在以下网址查看错误:www.neevasoft.com/docas
在我连接到的文件夹中添加了css和javascripts。
这是来自GitHub
<script type="text/javascript">
jQuery( document ).ready(function( $ ) {
$( '#my-slider' ).sliderPro();
});
</script>
这是我的
jQuery( document ).ready(function( $ ) {
$( '#my-slider' ).sliderPro({
width: '50%',
height: 500,
aspectRatio: 1.5,
visibleSize: '100%',
forceSize: 'fullWidth'
});
错误就是这个
ReferenceError:jQuery未定义
Html与GitHub相同,只更改了文件夹的位置
<div class="slider-pro"id="my-slider" >
<div class="sp-slides">
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image1_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image1_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image1_large.jpg"/>
</a>
<p class="sp-caption">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image2_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image2_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image2_large.jpg"/>
</a>
<p class="sp-caption">Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image3_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image3_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image3_large.jpg"/>
</a>
<p class="sp-caption">Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image4_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image4_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image4_large.jpg"/>
</a>
<p class="sp-caption">Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image5_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image5_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image5_large.jpg"/>
</a>
<p class="sp-caption">Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image6_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image6_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image6_large.jpg"/>
</a>
<p class="sp-caption">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image7_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image7_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image7_large.jpg"/>
</a>
<p class="sp-caption">Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image8_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image8_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image8_large.jpg"/>
</a>
<p class="sp-caption">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image9_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image9_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image9_large.jpg"/>
</a>
<p class="sp-caption">Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit.</p>
</div>
<div class="sp-slide">
<a href="http://bqworks.com/slider-pro/images/image10_large.jpg">
<img class="sp-image" src="src/css/images/blank.gif"
data-src="http://bqworks.com/slider-pro/images/image10_medium.jpg"
data-retina="http://bqworks.com/slider-pro/images/image10_large.jpg"/>
</a>
<p class="sp-caption">Sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.</p>
</div>
</div>