Options
Add border to thumbnail on hover and active
AceCo55
Registered Users Posts: 950 Major grins
With only a miniscule knowledge of css (copy-paste king), I have ALMOST got what I want.
On hover over Smugmug gallery thumbnail, I want a 2px border (#fe7c00)
Then if I select a thumbnail (to view it as larger image on right), I want the border to change AND REMAIN as #f2f4f8 ... and remain so until another thumbnail is selected (and then THAT thumbnail has the white-ish border).
This is the code I am using:
/* Add border to thumbnails on hover and active */
.sm-user-ui .sm-tiles .sm-tile-content:hover {
border: 2px solid #fe7c00 !important;}
.sm-user-ui .sm-tiles .sm-tile-content:active {
border: 2px solid #f2f4f8 !important;}
It almost works. Hover works fine. When I click to select and make a thumbnail active, the border changes for a moment then goes away. So each time I click on a thumbnail, the border does goes white but it doesn't persist.
Can someone with css skills be able to see what I need to change to get the desired effect.
Thanks for any help - it is/will be much appreciated
On hover over Smugmug gallery thumbnail, I want a 2px border (#fe7c00)
Then if I select a thumbnail (to view it as larger image on right), I want the border to change AND REMAIN as #f2f4f8 ... and remain so until another thumbnail is selected (and then THAT thumbnail has the white-ish border).
This is the code I am using:
/* Add border to thumbnails on hover and active */
.sm-user-ui .sm-tiles .sm-tile-content:hover {
border: 2px solid #fe7c00 !important;}
.sm-user-ui .sm-tiles .sm-tile-content:active {
border: 2px solid #f2f4f8 !important;}
It almost works. Hover works fine. When I click to select and make a thumbnail active, the border changes for a moment then goes away. So each time I click on a thumbnail, the border does goes white but it doesn't persist.
Can someone with css skills be able to see what I need to change to get the desired effect.
Thanks for any help - it is/will be much appreciated
My opinion does not necessarily make it true. What you do with my opinion is entirely up to you.
www.acecootephotography.com
www.acecootephotography.com
0
Comments
See this: http://www.w3schools.com/cssref/sel_hover.asp
Images in the Backcountry
My SmugMug Customizations | Adding CSS to Your Site | SEO for the Photographer | Locate Your Page/Widget Number | SmugMug Help Desk
I was able to do that in Legacy ... and was hoping to reproduce it in NewSmug
Cobbled the code from here:
http://www.w3schools.com/cssref/sel_active.asp
This is the code that worked in Legacy ... THANKS DENISE!!
a:active img.imgBorder, .imgBorderOn {
border-color: #f60 !important;
border-width: 2px !important;
}
www.acecootephotography.com
http://www.dgrin.com/showthread.php?t=237475
http://www.dgrin.com/showthread.php?t=240899
My Website index | My Blog
Thank you Allen for taking the time to pass on that info ... I have added my voice to the request.
www.acecootephotography.com