Wordpress Themes - WP Forum at BFA
There will be no more development for Atahualpa (or any other theme), and no support. Also no new registrations. I turned off the donation system. I may turn the forum to read only if it gets abused for spam. Unfortunately I have no time for the forum or the themes. Thanks a lot to the people who helped in all these years, especially Larry and of course: Paul. Take care and stay healthy -- Flynn, Atahualpa developer, Sep 2021

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Sidebars & Widgets »

Changing sidebar "background image" with mouse-over link?


  #1  
Old Nov 4, 2010, 02:41 PM
49Monsters's Avatar
49Monsters
 
41 posts · Aug 2010
MN
I have a text widget in sidebar containing nav buttons. Each button in the widget has a blank/normal/hover versions.

I want an image in the sidebar background.

Is there a way that "each" button's hover view could have it's own unique sidebar background? So on mouse-over not only would the button image change, the background it sits on would as well???
  #2  
Old Nov 4, 2010, 06:12 PM
juggledad's Avatar
juggledad
 
23,765 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
not that I'm aware of because the widget background is an parent element of the button. think of nested boxes: the widget is the outer box and the buttons are the inside box - anything that happens to the outside box is applied to the inside box unless you override them. However, things applied to the inside can not effect the outside box
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Nov 4, 2010, 07:26 PM
49Monsters's Avatar
49Monsters
 
41 posts · Aug 2010
MN
OK JD. Thats kinda what I expected.

Let me ask you this then. Right now each button has a div in the text widget containing a "button_blank". Then I have code in "Add HTML/CSS". Like so:

<div
id="Button2">
<a href="http://mylink" target= "_self"><img src="./wp-content/themes/atahualpa353/images/Button2_blank.gif" ></a>
</div>



/*---------------- MY BUTTON2 button CSS - START --------------*/

div#Button2 {z-index: 4; position: top left; float: left; width: auto; margin-right: 0px; margin-left: 145px;
margin-top: 10px;
}

div#Button2 {
height: 90px; width: 90px; border-width: 0; z-index:999;}

div#Button2 img {
background: url(./wp-content/themes/atahualpa353/images/Button2_normal.png) top left no-repeat;}

div#Button2 :hover img {
background: url(./wp-content/themes/atahualpa353/images/Button_hover.png) top left no-repeat;
}


All three button views are 90X90. Is there a way to have the "hover" view much larger without having the blank larger? In other words, I would like to be able to have the hover active only within the 90x90 size of the normal view, but once active, the hover image would be a much larger. image.

Bookmarks



Similar Threads
Thread Thread Starter Forum Replies Last Post
changing "leave a comment" at the bottom of post on homepage gwpad Forum How-To 1 May 31, 2010 04:59 AM
Background color "sub-pages" and "whole menu bar" gxxfy Page & Category Menu Bars 1 Nov 24, 2009 03:46 AM
"About" row, footer links, sidebar background, logos in a line ctenos Header configuration & styling 1 Jul 28, 2009 02:21 PM
Changing Hover Color of "Submit Comment" Button adum Comments, trackbacks & pings 2 Jun 21, 2009 03:37 PM
modifying font size of "Today's Events" and "Upcoming Events" in sidebar ritland Forum How-To 0 Mar 16, 2009 04:23 PM


All times are GMT -6. The time now is 02:01 AM.


Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.