Javascript Image Slider >
Posts >
where to put the code and the javascript file?
Hi,
I am not advanced user and am wondering how to make this work? It would be good if you can make a step-by-step tutorial how to use this nice looking javascript slider.
For example, I dont know what to do with the downloaded files, where do I have to put them etc..
1. "Choose an appropriate demo and put its codes to your own pages" --> Put where exactly?
2. "If you are not an advanced user, you need to place a hidden link on the page" --> what link, and where?
3. "Customize the image slider by changing the sliderOptions in the Javascript file" --> where is this Javascript file? (see related question 1.)
Thank you! I appreciate your help :)
one year ago
Hello. The quickest way to use the Javascript Image Slider is by downloading the sample demos
To answer your questions:
1.The source code includes: HTML (demo1.html), CSS (js-image-slider.css), and Javascript (js-image-slider.js). They are all included in the downloaded package.
For example, the HTML code below can be pasted into your page, between the <body> tags where you want your image slider to appear:
<div id="slider">
<img src="images/menucool-image-slider-1.jpg" alt="Caption goes here" />
<img src="images/menucool-image-slider-2.jpg" alt="" />
<a href="myPage2.html"><img src="images/menucool-image-slider-2.jpg" alt="Caption for this slide" /></a>
</div>
<a id="mcis" href="http://www.menucool.com">javascript image slider, menu, tooltip, tabbed content</a>
2. The last line of the code above is a hidden link for non-licensed slider. It will be automatically hidden by the image slider CSS file and not visible to users.
3. You can find the sliderOptions variable in the js-image-slider.js file and update its settings as desired. Please check out the <Directions> tab on the
Javascript Image Slider page for details.
Give me a holler if there's anything unclear.
- Milo
one year ago
I'm using AJAX to dynamically load content in my webpages. The demo1 layout plays fine when I visit the page directly for the first time. But when I load the same page via AJAX (using a link on a previous page), the slider gets stuck on the loading screen. Any ideas on what might be going wrong here?
Solution:
The slider script has a page load event (similar to jQuery's $(window).load(...)) that starts loading the images for the slider after the page load. I think the AJAX might load something that happens later than the slider's loads and cause the problem.
This post was modified by administrator on 2012/06/16 09:44