How to install aviaslider slideshow using Dreameweaver CS5 « Support Forum | Kriesi.at

Support Forum » Other Themes

How to install aviaslider slideshow using Dreameweaver CS5

4 posts from 2 voices

Started 2 years ago by njaneer
Latest reply from Dude
This topic is not a support question

Tags:

njaneer
Member

Installation instructions seem to be cryptic (at least from my perspective). Need guidance on how to install aviaslider using Dreamweaver CS5. Not familiar with jquery applications; so, any help in facilitating installation would be great.

Thanks.

Posted 2 years ago #

Dude
Dude

Hey,
first include following files in the head:

<!-- ########## CSS Files ########## -->
	<!-- Screen CSS -->
	<link rel="stylesheet" href="http://my-website.com/aviaslider/style.css" type="text/css" media="screen" />
  <!-- ########## end css ########## -->	

	<!-- JAVASCRIPT GOES HERE -->
	<script type='text/javascript' src='http://my-website.com/aviaslider/js/jquery.js'></script>
	<script type='text/javascript' src='http://my-website.com/aviaslider/js/jquery.aviaSlider.min.js'></script>

       <script type='text/javascript'>
         jQuery(document).ready(function(){

          // here you can see the slide options
             jQuery('#aviaslider').aviaSlider();

         });

       </script>

And in the body section, add following:

<ul id="aviaslider">
             <li><a href="http://my-website.com/images/slides/1.jpg" title=""><img src="http://my-website.com/images/slides/1.jpg" alt="" /></a></li>
             <li><a href="http://my-website.com/images/slides/2.jpg" title=""><img src="http://my-website.com/images/slides/2.jpg" alt="" /></a></li>
             <li><a href="http://my-website.com/images/slides/3.jpg" title=""><img src="http://my-website.com/images/slides/3.jpg" alt="" /></a></li>
             <li><a href="http://my-website.com/images/slides/4.jpg" title=""><img src="http://my-website.com/images/slides/4.jpg" alt="" /></a></li>
       </ul>

Obviously you need to adjust the paths :)

Posted 2 years ago #

njaneer
Member

I successfully setup the aviaslider based on the code that you provided. Thanks. However, when testing the slider, the location of the slides appear in the upper left corner of the web page; yet, I placed the html code that locates the jpegs in the bottom-center position of the page. I'm not sure why the code displays the jpegs in the desired location, but the actual slide show appears in the upper left corner of the webpage simultaneously. I suspect this may have to do with a CSS location settings. Need assistance in locating the slide show and hiding the jpegs when loading the page. Thanks for your help.

Posted 1 year ago #
Dude
Dude

Hey,
can you post a link to your sample page/test page?

Posted 1 year ago #