I've been trying to change the previous pause next links to images - to make the slideshow look more professional. I've gotten pretty close with the following css:

.defaultblock_slideshow a.views_slideshow_singleframe_pause{
padding: 15px 0; /* height of the replacement image */
height: 0px;
color: transparent;
overflow: hidden;
background-image: url('img/slideshow_pager/pause.jpg');
background-repeat: no-repeat;
}

(This for the pause button, the play button is similar. The previous and next use: .defaultblock_slideshow a#views_slideshow_singleframe_next_1)

My problem is that "color: transparent" isn't working in IE8. I don't know about other IE versions yet. Is anyone familiar with a way to do this? Can this be done through the JQuery Cycle Options box?

http://drupal.org/files/slideshow_eg.jpg">Here's what it looks like in firefox - the way I want it
http://drupal.org/files/slideshow_eg2.jpg">Here's what it looks like in IE8 - with the text casting a black shadow over the pictures

This is really a CSS question, but since it pertains to this module, and I know others will want to replace the text with images I wanted to see if anyone could help.

CommentFileSizeAuthor
slideshow_eg2.jpg111.96 KBjhofer
slideshow_eg.jpg133.65 KBjhofer

Comments

jhofer’s picture

jhofer commented

ooops, those links didn't work... here are the examples:

Here's what it looks like in firefox - the way I want it
Here's what it looks like in IE8 - with the text casting a black shadow over the pictures

jhofer’s picture

jhofer commented

I came across a workable solution: set font-size: 1px;
This makes the text so small that it isn't really noticeable. If you set the font color to be similar to the color of your pagers you're gravy.

I'm still curious as to what solutions others have come across. By the way - I googled "css change images to text" and found this solution here: http://css-tricks.com/css-image-replacement/

Standart’s picture

Standart commented
Status: Active » Fixed

Nice list of CSS ways.

Anyway, the module should provide a way to theme the controls appropriately. See #660312: Make slideshow controls themable for the feature request.

psynaptic’s picture

psynaptic commented

See my example here of how you can use images for the control links:

http://drupal.org/node/660312#comment-2597956

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.