Delete background color when hover images and customize slideshow

deandelso / 2014-02-28 11:45:20   

Hello!
I’m working on a web for my studio deandelso.com. I’d like to customize a few things that maybe are very easy but I've searched the forum and I was unable to find out how this can be done. I am new at CSS but I’ve made some modifications yet, so if it’s a simple coding thing I thik I could manage.

1.First thing is about hover images:
My links have a background with color on hover (yellow) but I don’t want this effect for the images. I looked forward the forum and I found similar questions and I tried to play with the style.css file, but I couldn’t do it.

2.The other things are about slideshow. I use this exhibit format to show all my proyects (PROYECTOS in the index). I have customize the file format.slideshow.php with word pad and uploaded it with filezilla.

I changed the words “Previous/Next” for “Prev/Next”, and then I placed them before the numbers, but now the space between “Next” and the numbers is very small... How can I increase it?

The other thing I want to do is to create a link to a text with more information about the proyect. I could manage to put the word “+info” beside the numbers, but now I don’t know how redirect it to an exhibit with only text… I suppose I’ve to create a subsection or something… How can I do that?

Any help would be greatly appreciated!
Thanks in advance!

P.S. Thanks for Indexhibit 2. It is great!

arsondpi / 2014-02-28 12:14:11   

1.
You'll need either Firebug the Firefox plugin or some bookmarklet to target and track down the exact css selector.
Since you're using Visual Index and slideshow I think the following will do (notice the !important attribute which overrides every other css rule for the chosen selector.

  1. .picture_holder a { background: transparent !important; }
  2. #slideshow a { background: transparent !important; }

2.
Again using Firebug I found out that you should effect a selector called #total

3. Make “+info” into a link

  1. <a link='url of your exhibit goes here'>+info</a>

The exhibit with the text could be a hidden exhibit (page options > hide exhibit from index, On)

deandelso / 2014-02-28 15:00:28   

Thans arsondpi for your quick response.
I use Firebug, but as I am new at programming there are many things that i dont understadn very well.

1. I'd put the code you told me on the file style.css and it works fine for all the images except for the logo that I have on the pre-nav text... how can i do that?

2. I've tried to put the selector #total on the format.slideshow.php but surely i'm not doing it properly because i can't increase the space between next and the numbers

3. Fo the +info link I have a question.
I've created a new section called "TEXTOS" so I can create the exhibits with the only text (one for each proyect) so I will have a exhibit to redirect each "+info" link.
Then what I think I've to do is to modify the file format.slideshow.php to make "+info" into a link.... I'll have a diferent text for each proyect, so never is the same url:

+info

The question is... what url do I have to put on the file format.slideshow.php?

I think I should call with the same title both exhibits (the one with the slideshow and the one with the text) ...

Thanks in advance,

deandelso / 2014-02-28 15:02:26   

Sorry, instead of +info I sould have posted:

  1. <a href="deandelso.com/textos/…;

arsondpi / 2014-02-28 15:31:26   

1. right click on your logo and select Inpect element with firebug.
Again in firebug's code right click the element and select Copy CSS path.
You'll see:
html body.exhibits div#index div.container div.top a
which -assuming that you know code basics- can be shortened to
#index .top a

2. This is wrong:

  1. <a href="#total">    </a>

I mean't put the selector with an attribute in the css part of the format or in your style.css, for example:

  1. #total { padding: 0 100px 0 200px; }

3. Now I understood that +info is incorporated to the actual format.
I don't recommend this as formats have universal appearances and you'd need serious coding skills to do this automatically.
What I suggest is to insert the link to the text-exhibit in your caption, just as I mention on my first post.

deandelso / 2014-02-28 15:47:31   

Thank you very much, I'll try it!

deandelso / 2014-03-03 12:45:00   

Hello Arsondpi,
I worked with your recommendations and I could do nearly every thing I wanted and it works!
The only thing I could'nt do was to delete the yellow background when I hover the logo, my coding skills are very limitated. For the moment I'll leave it and keep working on the web.
Thank you very much for your patience

This thread has been closed, thank you.