Avia Slider No Border

15 posts from 3 voices

• Started 1 year ago by pursuit2000
• Latest reply from Dude
• This topic is not a support question

Tags:

No tags yet.

1. 

   pursuit2000
   Member

   Hello,

   No matter what I try, I can't seem to get he border to not show up on my Avia Slider install. Here is my page: http://216.17.245.120/html/

   I am using the UL Class, but I can't seem to figure out the Div Class. When I use that syntax it won't slide for me.

   Can someone help me with this?

   Thanks!

   -JS

   Posted 1 year ago #
2. 

   Dude
   Dude

   Hey,
   try to add following codeto one of your stylesheets:
   

   .aviaslider img, .aviaslider a img, .aviaslider a{
   color: #fff !important;
   }

   Posted 1 year ago #
3. 

   pursuit2000
   Member

   Hi,

   Thanks for the prompt response. For some reason, now the images don't load, here is the code I have on the page now:

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

   Here is the Stylesheet:

   /************************************************************************
   -) Slider: only the following lines are necceassary for slider styling,
   rest of the css file styles the demo page
   *************************************************************************/
   .aviaslider{
   height:200px; /*this changes the height of the image slider*/
   width:1200px;
   overflow: hidden;
   position: relative;
   background: #fff url(../images/layout/preload.gif) center center no-repeat;
   }

   .aviaslider img, .aviaslider a img, .aviaslider a{
   color: #fff !important;
   }

   .aviaslider li, .aviaslider .featured{
   display: block;
   width:100%;
   height:100%;
   position: absolute;
   top:0;
   left:0;
   z-index: 1;
   }

   .js_active .aviaslider li, .js_active .aviaslider .featured{
   display:none;
   }

   .aviaslider img, .aviaslider a img, .aviaslider a{
   border:none;
   text-decoration: none;
   }

   Is there something I am missing?

   Thanks!

   -JS

   Posted 1 year ago #
4. 

   pursuit2000
   Member

   CORRECTION:

   I got the opening image to display, but it doesn't slide:
   

   <div class='aviaslider' id="diagonal-blocks">
   <div class=".featured"><a href="images/slides/slide1.jpg" title=""><img src="images/slides/slide1.jpg" alt="" /></a></div>
   <div class=".featured"><a href="images/slides/slide2.jpg" title=""><img src="images/slides/slide2.jpg" alt="" /></a></div>
   <div class=".featured"><a href="images/slides/slide3.jpg" title=""><img src="images/slides/slide3.jpg" alt="" /></a></div>
   <div class=".featured"><a href="images/slides/slide4.jpg" title=""><img src="images/slides/slide4.jpg" alt="" /></a></div>
   </div>

   The URL is at: http://216.17.245.120/html/

   Thanks!

   -JS

   Posted 1 year ago #
5. 

   Dude
   Dude

   Open up the custom.js file, delete the whole content and insert following code instead:
   

   jQuery(document).ready(function(){
   
   //activate the lightbox
   jQuery('a[href$=jpg], a[href$=png], a[href$=gif], a[href$=jpeg]').prettyPhoto({theme: "light_square"});
   
   jQuery('#diagonal-blocks').aviaSlider({
   blockSize: {height: 80, width:80},
   transition: 'slide',
   display: 'diagonaltop',
   switchMovement: true
   });	
   
   });

   You can add, remove or change the parameters (transition, etc.) if you like :)

   Posted 1 year ago #
6. 

   pursuit2000
   Member

   Sorry, this also didn't work. I tried replacing the entire file as well as adding it into the custom.js file and nothing. Only the first image appears and then it never transitions.

   To be clear, all I want is the image to transition with no border around it or no space.

   Thanks!

   -JS

   Posted 1 year ago #
7. 

   Dude
   Dude

   Can you send me the ftp login data to: kriesi2000-dude@yahoo.com - I'll install the modified custom.js file.

   Posted 1 year ago #
8. 

   pursuit2000
   Member

   Hello,

   Did you get my last response? I e-mailed it, basically check out this site, I want there to be no space around the image:

   http://216.17.245.120/html/

   FTP is the same if you want to go in and check it out.

   Thanks,

   -JS

   Posted 1 year ago #
9. 

   Chris Beard
   

   Hey,
   Dude is currently away for 9 more days, if you just want to remove the border you can just change:

   <table width="1200" height="200" cellspacing="0" cellpadding="0" border="1">
   to
   <table width="1200" height="200" cellspacing="0" cellpadding="0" border="0">

   I'm uncertain if it is as easy as this since I don't know how the code is output, I don't have these files. I'll ask Kriesi.

   Posted 1 year ago #
10. 

    pursuit2000
    Member

    Hello,

    I can wait, it's not just removing the table border. When I use the

    it will slide as it should but unfortunately it leaves an open space. I can't make it to work with just using the <div> tags.

    Anyway, please let him know when he gets back and if he can help me.

    Thank you!

    -JS

    Posted 1 year ago #
11. 

    Dude
    Dude

    I created an example with a div. I'm not familiar with table coding :)

    Posted 1 year ago #
12. 

    pursuit2000
    Member

    Can you send it to me please?

    Thanks!

    -JS

    Posted 1 year ago #
13. 

    Dude
    Dude

    The example code is:
    

    <div style="margin:auto; border: 1px solid #000;width:1200px;height:200px;">
    <ul class='aviaslider' id="diagonal-blocks" style="margin:0;">
    <li class="featured"><img src="images/slides/slide1.jpg" alt="" /></li>
    <li class="featured"><img src="images/slides/slide2.jpg" alt="" /></li>
    <li class="featured"><img src="images/slides/slide3.jpg" alt="" /></li>
    <li class="featured"><img src="images/slides/slide4.jpg" alt="" /></li>
    </ul>
    </div>

    (of course css styles would be better than inline styles). I added the code to: http://216.17.245.120/html/

    Posted 1 year ago #
14. 

    pursuit2000
    Member

    Thank you very much... Looks great! Let me try it out for sure...

    Thanks again,

    -JS

    Posted 1 year ago #
15. 

    Dude
    Dude

    Glad that I could help you :)

    Posted 1 year ago #

RSS feed for this topic

Reply

You must log in to post.