-
Notifications
You must be signed in to change notification settings - Fork 1.8k
Frequently Asked Questions
Because everyone has questions.
jQuery is the most popular Javascript framework used today. It is used mostly for DOM manipulation (animating divs, changing dimensions, calculating positioning, etc..). However, it can be used for much more than that, such as AJAX, form validation, etc.. Almost every project in which I have played a role has used jQuery. So get to know it!
Here is a list of things to check that should solve most "not working" problems:
- Is the jQuery library included in the of the document?
- The jQuery library needs to be included BEFORE the jquery.bxslider.min.js file.
- Is the jquery.bxslider.min.js file linked properly? Usually people will upload the file to a js directory, then link to it like so: <script src="js/jquery.bxslider.min.js"></script>
- Using Firebug (http://getfirebug.com/), check the console for any errors. Any Javascript errors can and will prevent the slider from functioning properly.
- Are you calling .bxSlider() inside of a $(document).ready() call? For more info on the .ready() call, click here.
- Nope! The slider does not care if the parent element (<ul> in the homepage example) has a classname. Simply target the parent element using any jQuery selector you desire. The following example is a completely legit slider setup:
HTML:
<div id="foobar">
<div>Child 1</div>
<div>Child 2</div>
<div>Child 3</div>
</div>
JS:
$(document).ready(function(){
$('#foobar').bxSlider();
});
You betcha. Check out the example.
When using a horizontal carousel (displaying multiple slides at once) the following three settings MUST be defined (vertical carousels can omit maxSlides):
minSlides maxSlides slideWidth Also remember that all slides should be the same width.
To make all videos in a slider responsive, make sure the following is true:
In the <head> of the document include the file: plugins/jquery.fitvids.js Specify the following option: video: true
The theme's images rely on the "images" folder included in the bxSlider package. Make sure that the "images" folder is in the same location as the jquery.bxslider.css file.
Absolutely not! Simply do not include the jquery.bxslider.css file and you will have a bare-bones slider, with no theme. Feel free to make yours look cooler than mine.
All modern versions of Firefox, Chrome, Safari, iOS, Android, and Internet Explorer have been tested and are supported. IE8 and IE7 have been tested and work just fine. But if you're supporting IE8 and below, have mercy on your poor soul.
Instead of trying to concoct my own lame definition, learn from the pros by clicking here.
Can I include your slider in my commercial WordPress theme? Do I have to pay you? Is thing really free?
The bxSlider is released under the WTFPL license - http://sam.zoy.org/wtfpl/ (love the name BTW). This means that you can literally do whatever you want with this plugin. If you like it and use it, buy me a beer for crying out loud!
Click here for v3 documentation
Click here to see the annotated source code with a description of the coding process
Unfamiliar with npm? Don't have node installed? Download and install node.js before proceeding.
From the command line:
- Install the CLI:
npm install --global gulp-cli
- Run
npm install
to install local development tools - Run
gulp
which will build the project
Everyone is welcome to help contribute and improve this project. There are several ways you can contribute:
- Reporting issues (please read issue guidelines)
- Suggesting new features
- Writing or refactoring code
- Fixing issues