Page 1 of 1
[1.5.1] - Nivo Slider transition
Posted: Sat Jul 23, 2011 6:32 am
by CypherUK
Hi Guys.
Really simple question, but for the life of me change seem to find the right file...
I want to change the slider transition from random to fade, but cant find where to change it.
Can someone point me in the right direction and slap me around the head?
Cheers
Mark
Re: [1.5.1] - Nivo Slider transition
Posted: Sat Jul 23, 2011 6:38 am
by uksitebuilder
open: catalog/view/theme/default/template/module/slideshow.tpl
find:
Code: Select all
$('#slideshow<?php echo $module; ?>').nivoSlider();
change to:
Code: Select all
$('#slideshow<?php echo $module; ?>').nivoSlider({effect:'fade'});
Re: [1.5.1] - Nivo Slider transition
Posted: Sat Jul 23, 2011 6:41 am
by uksitebuilder
Here are some more options you can play with:
Not sure if they all work though
Code: Select all
$('#slideshow<?php echo $module; ?>').nivoSlider({
effect:'random', // Specify sets like: 'fold,fade,sliceDown'
slices:15, // For slice animations
boxCols: 8, // For box animations
boxRows: 4, // For box animations
animSpeed:500, // Slide transition speed
pauseTime:3000, // How long each slide will show
startSlide:0, // Set starting Slide (0 index)
directionNav:true, // Next & Prev navigation
directionNavHide:true, // Only show on hover
controlNav:true, // 1,2,3... navigation
controlNavThumbs:false, // Use thumbnails for Control Nav
controlNavThumbsFromRel:false, // Use image rel for thumbs
controlNavThumbsSearch: '.jpg', // Replace this with...
controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
keyboardNav:true, // Use left & right arrows
pauseOnHover:true, // Stop animation while hovering
manualAdvance:false, // Force manual transitions
captionOpacity:0.8, // Universal caption opacity
prevText: 'Prev', // Prev directionNav text
nextText: 'Next', // Next directionNav text
beforeChange: function(){}, // Triggers before a slide transition
afterChange: function(){}, // Triggers after a slide transition
slideshowEnd: function(){}, // Triggers after all slides have been shown
lastSlide: function(){}, // Triggers when last slide is shown
afterLoad: function(){} // Triggers when slider has loaded
});
Re: [1.5.1] - Nivo Slider transition
Posted: Sat Jul 23, 2011 6:45 am
by CypherUK
Legend! - Cheers Simon.
Re: [1.5.1] - Nivo Slider transition
Posted: Fri Aug 12, 2011 2:16 am
by defiantclass
I've been testing some of these, thank you for providing them. 2 questions:
1. After adding "directionNav:true" I decided to take it out. However they still appear on the page. I have updated my slideshow.tpl several times and the control will not go away. Also cleared cache.
2. Is there any way to get the slideshow centered in the page? I'm using it at the bottom of the page and I have no side bars on either side of the page. The slideshow wants to sits off to the left of the page though.
Thanks
Re: [1.5.1] - Nivo Slider transition
Posted: Fri Aug 12, 2011 2:27 am
by uksitebuilder
Can we see a link - should be able to position with CSS
Re: [1.5.1] - Nivo Slider transition
Posted: Fri Aug 12, 2011 2:44 am
by CypherUK
around line 121 of slideshow.css you will see:
Code: Select all
.nivo-directionNav a {
display:block;
width:30px;
height:30px;
background:url('../image/arrows.png') no-repeat;
text-indent:-9999px;
border:0;
}
Change to
Code: Select all
.nivo-directionNav a {
display:block;
width:30px;
height:30px;
background:url('../image/arrows.png') no-repeat;
text-indent:-9999px;
border:0;
display:none;
}
That should get rid of your nav arrows
Re: [1.5.1] - Nivo Slider transition
Posted: Sat Aug 13, 2011 12:03 am
by defiantclass
That's great, the arrows are gone, thank you.
As for the centering, here is my link:
http://www.xxxxxxxxxxxxx.com/
The slideshow is down near the bottom, thank you for taking the time!
Re: [1.5.1] - Nivo Slider transition
Posted: Sat Aug 13, 2011 12:18 am
by CypherUK
Have you tried widening your banner? - go to admin>extensions>modules>slideshow and change the width to 950 - see if that helps.
Re: [1.5.1] - Nivo Slider transition
Posted: Mon Aug 15, 2011 10:02 pm
by defiantclass
Yes, I did do that, and yes it did help in making the images more centered. However I think doing that made my images larger than I wanted. However, I see now that I really need to rework my images to make them all the same size. Some are larger than others and that is causing other problems. I will do that first and then come back to testing different widths again and see how that works.
Thank you!
Re: [1.5.1] - Nivo Slider transition
Posted: Wed Aug 24, 2011 3:43 pm
by Rabbitdigital
2. Is there any way to get the slideshow centered in the page? I'm using it at the bottom of the page and I have no side bars on either side of the page. The slideshow wants to sits off to the left of the page though.
Thanks
Hi I'm not sure if you've already solved the centering issue but have you tried using CSS?
Just add this to the bottom of catalog/view/theme/YOURTEMPLATE/stylesheet/slideshow.css :
Re: [1.5.1] - Nivo Slider transition
Posted: Thu Aug 25, 2011 1:43 am
by defiantclass
Will do, thank you!
Re: [1.5.1] - Nivo Slider transition
Posted: Fri Mar 09, 2012 3:37 am
by rated
I can't get directionNav to work.JS code I use in slideshow.tpl :
Code: Select all
<script type="text/javascript"><!--
$(document).ready(function() {
$('#slideshow<?php echo $module; ?>').nivoSlider({directionNav:true}, {directionNavHide:false});
});
--></script>
If instead of directionNav:true I use other parameter for example effect:'random' or pauseTime:3000 it works.But I can't get it to work with directionNav.
I use version 1.5.1.3
Edit: I tried to get direvtionNav to work on
fresh installation( 1.5.1.3) and it didn't worked.Any ideas ?
Edit2: I FIXED THE STUFF.It seems it was working, but not visible.I put background:red; in css and it showed up.I ended with this line in JS.
Code: Select all
$('#slideshow<?php echo $module; ?>').nivoSlider({directionNavHide:false});