avia slider not complete

6 posts from 3 voices

• Started 10 months ago by Kornea
• Latest reply from Dude
• This topic is not a support question

Tags:

• Avia Slider

1. 

   Kornea
   Member

   my css is

   .aviaslider{
   height:320px; /*this changes the height of the image slider*/
   width:640px;
   overflow: hidden;
   position: relative;
   background: #fff url(../images/layout/preload.gif) center center no-repeat;
   }

   .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;
   }

   .slidecontrolls{
   margin:20px auto 0 auto;
   position: relative;
   float:left;
   }

   .slidecontrolls a{
   height:20px;
   width:18px;
   display:block;
   cursor: pointer;
   background: transparent url(../images/layout/controlls.gif) center bottom no-repeat;
   float:left;
   outline: none;
   }

   .slidecontrolls a:hover, .slidecontrolls .active_item{
   background: transparent url(../images/layout/controlls.gif) center top no-repeat;
   }

   .feature_excerpt{
   width:610px;
   position: absolute;
   display: block;
   bottom: 0;
   left:0;
   z-index: 2;
   padding:14px 15px;
   font-size: 11.5px;
   line-height:1.5em;
   cursor: pointer;
   background: #000;
   color: #fff;
   }

   .feature_excerpt strong{
   display: block;
   font-size: 15px;
   padding-bottom: 3px;
   }

   my code is
   

   <script type='text/javascript' src='http://my url/js/jquery.js'></script>
   	<script type='text/javascript' src='http://my url/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>
   
   <ul id="aviaslider">
   
   <li><a title=""><img src="http://my url/images/slides/1.jpg" alt="" /></a></li>
   <li><a title=""><img src="http://my url/images/slides/2.jpg" alt="" /></a></li>

   and i'm not modify every js file

   and this is print screen my site ( my site is intranet )

   http://image.ohozaa.com/i/636/PGWLuw.jpg

   Posted 10 months ago #
2. 

   Dude
   Dude

   Tbh it's hard to say what causes the issue without investigating the slider code first hand. However you can try to use following html code instead:

   <ul id="aviaslider">
   
   <li><img src="http://my url/images/slides/1.jpg" alt="" /></li>
   <li><img src="http://my url/images/slides/2.jpg" alt="" /></li>
   </ul>

   Because the a href element is not required.

   Posted 10 months ago #
3. 

   Kornea
   Member

   how to edit class kBlock ( you can found class kBlock at jquery.aviaSlider.js )

   i want to edit top left width height of kBlock

   Posted 10 months ago #
4. 

   Kornea
   Member

   please help me

   Posted 10 months ago #
5. 

   Mya
   

   Hi Kornea,

   I'm not really sure what you're asking about. I'm going to tag the rest of the team to see if they can help.

   Regards,
   Mya

   Posted 10 months ago #
6. 

   Dude
   Dude

   Search for following code in jquery.aviaSlider.js:

   $('<div class="kBlock"></div>').appendTo(slideWrapper).css({
   								zIndex:20,
   								position:'absolute',
   								display:'none',
   								left:posX,
   								top:posY,
   								height:options.blockSize.height,
   								width:options.blockSize.width,
   								backgroundPosition:bgOffset
   							});

   However be careful because you can break the animation easily.

   Posted 10 months ago #

RSS feed for this topic

Reply

You must log in to post.