Open GoogleCodeExporter opened 8 years ago
I did this. Just place the images as backgrounds for the "next" and "prev"
classes. Set them to display: block, and
set the height and width to the image height and width. I added in the
jquery.galleriffic.js file an extra span
around the link text that I could set to display:none in order to hide the
standard text. It's the usual screen-
reader degradable trick, just with the extra step of modifying the js code
slightly.
Original comment by jack.sta...@gmail.com
on 12 Feb 2010 at 6:25
It's easier not to add extra <span> tag.
Add in css something like this for 25px x 25px image:
.next{background:url(/link/to/image.gif);display:block;height:0;overflow:hidden;
padding:25px /* height of image*/ 0 0 0;width:25px /*width of image*/}
Original comment by kristaps...@gmail.com
on 14 Jul 2010 at 9:53
I followed the idea provided by Jack Stalnaker and for the most part this
worked, however the layout of the controls got messed up and the "previous" and
"next" buttons are no longer next to each other, but spread far apart.
Any suggestions on how to fix this?
Original comment by jmkeep...@gmail.com
on 1 Sep 2010 at 6:50
I have a different fix, and I didn't edit the CSS at all.
For your gallery, scroll down to where this bit starts:
// Initialize Advanced Galleriffic Gallery
var gallery = $('#thumbs').galleriffic({
and look for:
playLinkText: 'Play Slideshow',
pauseLinkText: 'Pause Slideshow',
prevLinkText: '‹ Previous Photo',
nextLinkText: 'Next Photo ›',
Change these fields to this:
playLinkText: '<img src="play.png" border="0" title="Play
Slideshow">',
pauseLinkText: '<img src="pause.png" border="0" title="Pause
Slideshow">',
prevLinkText: '<img src="previous.png" border="0" title="Previous
Photo',
nextLinkText: '<img src="next.png" border="0" title="Next Photo',
Now, there might be an error. When you preview this, your Previous and Next
buttons might be mashed together with "> sticking out. There is a segment of
code in the jquery.galleriffic.js file that is incomplete, but it only shows up
when you do something like this.
Open the jquery.galleriffic.js and search for this segment of code:
.append('<div class="nav-controls"><a class="prev" rel="history"
title="'+this.prevLinkText+'">'+this.prevLinkText+'</a><a class="next"
rel="history" title="'+this.nextLinkText+'">'+this.nextLinkText+'</a></div>')
And replace it with this:
.append('<div class="nav-controls"><a class="prev" rel="history"
title="'+this.prevLinkText+'">'+this.prevLinkText+'"></a><a class="next"
rel="history" title="'+this.nextLinkText+'">'+this.nextLinkText+'"></a></div>')
(The tags right before </a> for prev and next are not closed and need to be)
Voila!
Original comment by dianad...@gmail.com
on 7 Oct 2010 at 12:39
Unfortunately none of the above solutions seems to work in IE..whereas it works
perfectly for Mozilla or Opera.:/
Original comment by christos...@gmail.com
on 10 Dec 2010 at 9:50
[deleted comment]
I use this patch with 4 new paramaters wich default to the text if not provided.
Those parameters are the title of the controls.
Original comment by kio...@gmail.com
on 16 May 2012 at 1:02
Attachments:
Original issue reported on code.google.com by
daniel%j...@gtempaccount.com
on 3 Feb 2010 at 6:43