Tagged: , ,

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #9410

    I am having a very hard time with the avia slider, my code is below, and my file paths all seem to be correct, any help is appreciated.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Web Design & Development | SEO | Web Hosting | Internet Marketing</title>

    <!-- ########## CSS Files ########## -->
    <!-- Screen CSS -->
    <link rel="stylesheet" href="aviaslider-jquery-slideshow 2/html/css/style.css" type="text/css" media="screen" />
    <!-- lightbox CSS -->
    <link rel="stylesheet" href="aviaslider-jquery-slideshow 2/html/js/prettyPhoto/css/prettyPhoto.css" type="text/css" media="screen" />
    <!-- ########## end css ########## -->

    <!-- JAVASCRIPT GOES HERE -->
    <script type='text/javascript' src='aviaslider-jquery-slideshow 2/html/js/jquery.js'></script>
    <script src="aviaslider-jquery-slideshow 2/html/js/prettyPhoto/js/jquery.prettyPhoto.js" type="text/javascript"></script>

    <!--this file includes the aviaslider: -->
    <script type='text/javascript' src='aviaslider-jquery-slideshow 2/html/js/jquery.aviaSlider.js'></script>

    <!--this file includes the activation call for the avia slider. You should edit here: -->
    <script type='text/javascript' src='aviaslider-jquery-slideshow 2/html/js/custom.js'></script>

    <link href="css/main.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="css/megamenu.css" type="text/css" media="screen" /><!-- Mega Menu Stylesheet -->

    <link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

    <script src="prototype.js" type="text/javascript"></script>
    <script src="scriptaculous.js?load=effects,builder" type="text/javascript"></script>
    <script type="text/javascript" src="lightbox.js"></script>

    <script src="scripts/jquery.js" type="text/javascript"></script>

    <script type="text/javascript" src="js/megamenu.js"></script><!-- Mega Menu Script -->

    <script type="text/javascript" src="js/jquery.js"></script><!-- jQuery -->

    <script type="text/javascript">
    $(function() {
    $(".megamenu").megaMenu('hover_toggle');
    });

    function MM_preloadImages() { //v3.0
    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
    }
    </script>

    <!-- Start WOWSlider.com HEAD section --><script type="text/javascript" src="engine1/jquery.js"></script>
    <script type="text/javascript" src="engine1/wowslider.js"></script>
    <!-- End WOWSlider.com HEAD section -->

    <!--[if IE 6]>
    <link rel="stylesheet" type="text/css" href="css/ie6.css" />
    <![endif]-->

    </head><body>
    <div class="container">
    <div class="header"><img src="header/sitewired-header.png" />
    <div class="megamenu_container menu_grey">

    <ul class="megamenu"><!-- Begin Mega Menu -->

    <li><a href="#">ABOUT US</a><!-- Begin Item -->
    </li>
    <!-- End Item -->

    <li><a href="#">OUR WORK</a><!-- Begin Item -->
    </li>
    <li><a href="#">Web Services</a><!-- Begin Item -->
    <div class="drop8columns dropcontent"><!-- Begin Item Container -->

    <div class="col_8">

    </div>

    <div class="col_2">

    </div>

    <div class="col_2">

    </div>

    <div class="col_2">

    </div>

    <div class="col_2">

    <ul class="list2">

    </div>

    <div class="clear"></div>

    <div class="col_8">

    </div>

    <div class="col_8">

    <p class="dark"><span class="megamenuLinkTitles"><a href="#">Our Process</a></span>
    Over many years of industry experience, we've developed a methodology that applies to all projects regardless of size, length, and type of service.</p>

    <p class="brown"><span class="megamenuLinkTitles"><a href="#">Logo Design</a></span>
    <span class="megamenuParagraphText">The strategies behind designing a successful and memorable logo involves a process which progresses through various stages of listening, research, development, feedback.</span></p>

    <p class="yellow"><a href="#"><span class="megamenuLinkTitles">Website Design & Development</span></a>
    <span class="megamenuParagraphText">You have less than 3 seconds to keep a user on your website. How will you manage to grab their attention? We are experts in designing & building highly effective websites. </span></p>

    <p class="red"><a href="#"><span class="megamenuLinkTitles">ECommerce Design & Development</span></a>
    <span class="megamenuParagraphText">How many of your website visitors are turning into customers? We will help make your ecommerce website your most effective selling tool.</span></p>

    <p class="blue"><a href="#"><span class="megamenuLinkTitles">Content Management Systms</span></a>
    <span class="megamenuParagraphText">Our customized content management systems (CMS) will give you total control over your website. </span></p>

    <p class="green"><a href="#"><span class="megamenuLinkTitles">Small Business</span></a>
    Get a website that grows your business. It's time to move on from your template website and give your small business a professional look.</span></p>

    <p class="dark"><span class="megamenuLinkTitles"><a href="#">Drupal Development Services</a></span>
    Over many years of industry experience, we've developed a methodology that applies to all projects regardless of size, length, and type of service.</p>

    </div>

    </div><!-- End Item container -->

    </li>
    <!-- End Item -->

    <li><a href="#">online Marketing</a><!-- Begin Item -->
    <div class="drop8columns dropcontent"><!-- Begin Item Container -->

    <div class="col_8">

    </div>

    <div class="col_2">

    </div>

    <div class="col_2">

    </div>

    <div class="col_2">

    </div>

    <div class="col_2">

    <ul class="list2">

    </div>

    <div class="clear"></div>

    <div class="col_8">

    </div>

    <div class="col_8">

    <p class="dark"><span class="megamenuLinkTitles"><a href="#">Search Engine Optimization</a></span>
    Drive traffic to your website by achieving page 1 rankings in search engines for valuable keywords.</p>

    <p class="brown"><span class="megamenuLinkTitles"><a href="#">Social Media Marketing</a></span>
    <span class="megamenuParagraphText">Reach your audience in new ways through social media to build brand trust and loyalty.</span></p>

    <p class="yellow"><a href="#"><span class="megamenuLinkTitles">Email Marketing</span></a>
    <span class="megamenuParagraphText">Make the most of your list of subscribers through an optimized email marketing strategy. </span></p>

    <p class="red"><a href="#"><span class="megamenuLinkTitles">Conversion Optimization</span></a>
    <span class="megamenuParagraphText">Increase the percentage of your website visitors who turn into leads. </span></p>

    <p class="blue"><a href="#"><span class="megamenuLinkTitles">Social Media Integration</span></a>
    <span class="megamenuParagraphText">Give your customers the tools to make the most of your website </span></p>

    </div>

    </div><!-- End Item container -->

    </li>
    <!-- End Item -->

    <li><a href="#">CONTACT US</a><!-- Begin Item -->
    <div class="drop5columns dropcontent"><!-- Begin Item Container -->

    <div class="col_5">

    <form action="file:///Macintosh HD/Users/joe/Sites/SiteWiredNew/send">

    <p>Here is where I will have a quick contact form.</p>

    <p><label for="text_field">Text Field:</label>
    <input type="text" id="text_field" /></p>

    <p><label for="text_area">Text Area:</label>

    <textarea id="text_area" rows="6" cols="12"></textarea></p>

    <p><label>Radio Buttons:</label>

    <input type="radio" class="radio" name="radio_button" value="radio_1" /> Radio 1
    <input type="radio" class="radio" name="radio_button" value="radio_2" /> Radio 2
    </p>

    <p><label>Checkboxes:</label>
    <input type="checkbox" class="checkbox" name="checkboxes" value="check_1" /> Radio 1

    <input type="checkbox" class="checkbox" name="checkboxes" value="check_2" /> Radio 2
    </p>

    <p><input class="button" type="reset" value="Clear" /><input class="button" type="submit" value="Submit" /></p>

    </form>

    </div>

    </div><!-- End Item Container -->

    </li>
    <!-- End Item -->

    <li class="right"><a href="#">WEB HOSTING</a><!-- Begin Right Item -->

    <div class="drop2columns align_right dropcontent"><!-- Begin Right Item Container -->

    <div class="col_2">

    <ul>
    <li><a href="#">Linux Shared Hosting</a></li>
    <li><a href="#">Windows Shard Hosting</a></li>
    </ul>
    </div>

    </div><!-- End Right Item Container -->

    <!-- End Right Item -->

    <!-- End Mega Menu -->

    </div><!-- End Menu Container -->

    <!-- end .header --></div>
    <div class="content">
    <div class="quote-button"><img src="images/quote.png" /></div>

    <body id='top'>
    <div class="center">
    <ul class='aviaslider' id="frontpage-slider">

    <li><a href="aviaslider-jquery-slideshow 2/html/images/slides/1.jpg" title=""><img src="aviaslider-jquery-slideshow 2/html/images/slides/1.jpg" alt="" /></a></li>
    <li><a href="aviaslider-jquery-slideshow 2/html/images/slides/2.jpg" title=""><img src="aviaslider-jquery-slideshow 2/html/images/slides/2.jpg" alt="A heading of your choice :: This is the image description defined in your alt tag" /></a></li>
    <li><a href="aviaslider-jquery-slideshow 2/html/images/slides/5.jpg" title=""><img src="aviaslider-jquery-slideshow 2/html/images/slides/3.jpg" alt="Another heading :: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor" /></a></li>
    <li><a href="aviaslider-jquery-slideshow 2/html/images/slides/4.jpg" title=""><img src="aviaslider-jquery-slideshow 2/html/images/slides/4.jpg" alt="No Heading, just a line of content" /></a></li>
    <li><a href="aviaslider-jquery-slideshow 2/html/images/slides/5.jpg" title=""><img src="aviaslider-jquery-slideshow 2/html/images/slides/5.jpg" alt="" /></a></li>
    </div>

    #64650

    Hey,

    try to replace: aviaslider-jquery-slideshow 2 with another name/path like aviaslider-jquery-slideshow_2 or aviaslider-jquery-slideshow

    If this doesn’t help post a link to your website please (or the test page where you try to implement the avia slider) and I’ll look into it.

    #64651

    Hi,

    i download avia slider and i have problem make it run. offline at my localhost everything work fine but if i upload on ftp it doesnt work( i see only last slide image static without preloader and controls). Thx for help

    #64652

    I actually have already tried that, here is the testing link: http://sitewired.net/index-01-22-2012.html

    Here is the source code, I trile checked the file paths and even removed a JQ mega menu to see if I had a script conflict.

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

    <html xmlns=”http://www.w3.org/1999/xhtml”>

    <head>

    <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />

    <title>Web Design & Development | SEO | Web Hosting | Internet Marketing</title>

    <!– ########## CSS Files ########## –>

    <!– Screen CSS –>

    <link rel=”stylesheet” href=”css/style.css” type=”text/css” media=”screen” />

    <!– lightbox CSS –>

    <link rel=”stylesheet” href=”css/prettyPhoto.css” type=”text/css” media=”screen” />

    <!– ########## end css ########## –>

    <!– JAVASCRIPT GOES HERE –>

    <script type=’text/javascript’ src=’js/jquery.js’></script>

    <script src=”js/prettyPhoto/js/jquery.prettyPhoto.js” type=”text/javascript”></script>

    <!–this file includes the aviaslider: –>

    <script type=’text/javascript’ src=’js/jquery.aviaSlider.js’></script>

    <!–this file includes the activation call for the avia slider. You should edit here: –>

    <script type=’text/javascript’ src=’js/custom.js’></script>

    <link href=”css/main.css” rel=”stylesheet” type=”text/css” />

    <!– Mega Menu Stylesheet –>

    <script src=”scripts/jquery.js” type=”text/javascript”></script>

    <script type=”text/javascript” src=”js/megamenu.js”></script><!– Mega Menu Script –>

    <script type=”text/javascript” src=”js/jquery.js”></script><!– jQuery –>

    <script type=”text/javascript”>

    $(function() {

    $(“.megamenu”).megaMenu(‘hover_toggle’);

    });

    function MM_preloadImages() { //v3.0

    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

    if (a.indexOf(“#”)!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}

    }

    </script>

    <!– Start WOWSlider.com HEAD section –><script type=”text/javascript” src=”engine1/jquery.js”></script>

    <script type=”text/javascript” src=”engine1/wowslider.js”></script>

    <!– End WOWSlider.com HEAD section –>

    <!–[if IE 6]>

    <link rel=”stylesheet” type=”text/css” href=”css/ie6.css” />

    <![endif]–>

    </head><body>

    <div class=”container”>

    <div class=”header”>
    <!– End Menu Container –>

    <!– end .header –></div>

    <div class=”content”>

    <div class=’aviaslider’ id=”frontpage-slider”>

    <div class=”featured”></div>

    <div class=”featured”></div>

    <div class=”featured”></div>

    </div>

    </div>

    <p>

    <p>

    <p>

    <p>

    <p>  </p>

    <!– end .container –> </div>

    <!– end .container –></div>

    <div class=”footer”>

    <table width=”60%” border=”0″ align=”center” cellpadding=”10″ cellspacing=”0″>

    <tr>

    <td width=”26%” align=”left” valign=”top”><span class=”footerTitles”>Web Services</span>

    Our Process

    Logo Design

    Website Design & Development

    Content Management Systems

    Small Business

    Drupal Development Services
    </td>

    <td width=”23%” align=”left” valign=”top”><span class=”footerTitles”>Online Marketing</span>

    Search Engine Optimization

    Social Media Marketing

    Email Marketing

    Conversion Optimization

    Social Media Integration
    </td>

    <td width=”18%” align=”left” valign=”top” class=”footer1″><span class=”footerTitles”>Web Hosting</span>

    Linux Hosting

    Windows Hosting

    </td>

    <td width=”14%” align=”left” valign=”top” class=”footer1″><p><span class=”footerTitles”>More</span>

    Home

    About Us

    Conatct Us</p></td>

    <td width=”19%” align=”left” valign=”top” class=”footer1″><p><span class=”footerTitles”>Conatct Us</span>

    (Email address hidden if logged out)

    303-278-0911

    </p></td>

    </tr>

    <tr>

    <td colspan=”5″ align=”center” valign=”top”>© Copyright 2012 SiteWired.net</td>

    </tr>

    </table>

    <p> </p>

    <!– end .footer –></div>

    </body>

    </html>

    #64653

    If you use the default configuration you need to use a html list for the slides. In your case replace:

    <div class='aviaslider' id="frontpage-slider">

    <div class="featured"><a href="images/slides/1.jpg" title="" ><img src="images/slides/1.jpg" alt="" /></a></div>
    <div class="featured"><a href="images/slides/2.jpg" title=""><img src="images/slides/2.jpg" alt="" /></a></div>
    <div class="featured"><a href="images/slides/5.jpg" title=""><img src="images/slides/3.jpg" alt="" /></a></div>

    </div>

    with:

    <ul class='aviaslider' id="frontpage-slider">
    <li class="featured"><a href="images/slides/1.jpg" title="" ><img src="images/slides/1.jpg" alt="" /></a></li>
    <li class="featured"><a href="images/slides/2.jpg" title=""><img src="images/slides/2.jpg" alt="" /></a></li>
    <li class="featured"><a href="images/slides/5.jpg" title=""><img src="images/slides/3.jpg" alt="" /></a></li>
    </ul>

    #64654

    I have a question about Avia Slider but don’t know how to start a new subject here.

    I’m trying to put the slider in a table cell, but it’s changing the table and cell size. I would really appreciate any help in changing the size of the slider. Yes, I’ve changed it in the css/style.css, but that made little difference.

    http://dragonsflight.biz/azscia/normal_index.php

    #64655

    I investigated your website with the Chrome dev tools and it seems like the browser uses some “standard” values for the margins, paddings, etc. which affect the aviaslider too. Please include some “browser reset” css code which will take care of the browser specific standard values. I.e. you can use the normalize.css code from: https://github.com/h5bp/html5-boilerplate/blob/master/css/normalize.css

    #64656

    Thanks Dude for the reply.

    The CSS reset didn’t have any effect on the way the slider worked. I’ve decided to change the design of the page now to just use the slider at the normal size. I really wish there was some sort of interactive menu where you could choose the transition, the size, etc… and then have it generate the correct code. I know, keep wishing, but that would certainly be helpful to me.

    Anyhow, thanks for your reply.

    #64657

    BTW: How/Where do you start a new topic on this forum for the Slider?

    #64658

    You can start a new topic here: http://www.kriesi.at/support/forum/other-themes

    All the way at the bottom there is a button for creating a new thread.

    Regards,

    Devin

Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Avia Slider’ is closed to new replies.