Hiding Arrows on Carousel
chintu84 - January 17, 2009 - 05:37
| Project: | Views carousel |
| Version: | 6.x-1.x-dev |
| Component: | Code |
| Category: | feature request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | fixed |
Jump to:
Description
Hi,
This is a great module. As I was playing around with this module, I though, having previous and next arrows on a carousel which scrolls automatically is unnecessary. I have created a patch that adds an option to hide navigation arrows if the autoscroll is enabled (i.e. autoscroll value is > 0). I had to modify the uncompressed "jquery.jcarousel.js" file for this feature. I have re-compressed the "jquery.jcarousel.js" file using YUI Compressor.
If you apply this patch, it will add an option to hide/show navigation under Views Carousel settings (right below the autoscroll field).
Chintu
| Attachment | Size |
|---|---|
| viewscarousel-6.x-1.x-dev-hide-arrows.patch | 34.53 KB |
#1
You shouldn't change jquery.jcarousel.js at all as next time we update it, it would break this functionality. Wouldn't it be eaiser to just use CSS to hide the arrows?
#2
Rob,
Thanks for looking into this. I did try to create this functionality using CSS first, but the problem was it would still print out the code for navigation arrows and even though I set them to display: none, they were still clickable. But of course, I could give it try a again.
Chintu
#3
I'm trying to hide the arrows with css but my css is being overridden by the div call itself. It has div id style="display:block">
I have no idea where that code is to change it.
#4
You could probably set width and height to 0, or margin-left to -9999999px.
#5
If you want to hide the arrows set the overflow to hidden and the width and height to 0. Or, set them to display: none;
No altering the js which is an external library.
#6
Gthing
I found that you can override the hardcoded style declaration by marking the CSS display:none as important e.g.
div.jcarousel-next {display:none !important;}Cheers
Dave