472,976 Members | 1,417 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,976 software developers and data experts.

image rollover plus active state - possible?


I have a test site running at http://artbymichaelking.com/DS/

As you can see with the navigation I have the image rollover. I do this with CSS via:

Expand|Select|Wrap|Line Numbers
  1. .companyrollover a{
  2.     display: block;
  3.     width: 95px;
  4.     height: 20px;
  5.     background: url(images/menubar/COMPANY.jpg) no-repeat;
  6.     text-decoration: none;
  7.     float: left;
  8.          }
  10. .companyrollover a:hover {
  11.     background-position: -95px 0;
  12.            }
  14. .companyrollover a:active {
  15.     background-position: -95px 0;
  16.     }
Basically, the image is 190px wide and has two images in it, on the left is the non select image and the other is the selected image. On roller it just shift the red one into view.

However, I CANNOT get it to stay red after one clicks in a certain area.

As you can see from my code, I tried 'a:active' but that does not work.

Does anyone know how to make the rollover stay on the red version after it is clicked?


Mar 7 '08 #1
8 3203
7,435 Expert 4TB
Did you try a:visited?
Mar 7 '08 #2
Did you try a:visited?
Just tried it.

It works in that it will show the rolled over image I want after it is clicked, however it constantly shows after others are clicked as well.

Is there a way to revert it to the original image state once another menu link is selected?
Mar 7 '08 #3
7,435 Expert 4TB
Now you've gotten into javascript land.
Mar 7 '08 #4


Thanks for the info.
Mar 7 '08 #5
170 100+
Or, for each page, have the respective link colored red (in Photoshop).

Example, on home page load "company_pic_red", "xx1_pic_norm","xx_pic_norm", "xx2_pic_norm", etc..

However, when they click on the image for xx1 (bringing it to xx1.html), have the following pattern:

"company_pic_norm", "xx1_pic_red","xx_pic_norm", "xx2_pic_norm", etc..

I know it's not explained very well, but if you can comprehend what, exactly, I'm aiming for, than you're golden! All it is is editting a FEW files in Photoshop (or an image edittor of your choice).
Mar 7 '08 #6
Yup, I understand what you are doing but my site is made with php and css using Wordpress - yes, not the best for custom work......

and it will always call the same 'navbar' in for every page.
Mar 7 '08 #7
Now you've gotten into javascript land.
Just wanted to drop by and say you don't need to use javascript at all to complete this.

I did get it working perfectly with CSS. If anyone needs the solution you can PM me.
Mar 29 '08 #8

How did you accomplish this? I"m going crazy trying to figure it out. I'm only using 2 buttons but they direct to content in an iframe so there are no additional pages to have different active clicked classes.

Jan 17 '12 #9

Sign in to post your reply or Sign up for a free account.

Similar topics

by: mrb | last post by:
Is it possible to rollover an image in one table and create an effect in another table? I've looked all over for an answer to this but seem to be unable to find an answer. I want to be able...
by: MrBaseball34 | last post by:
I have a rollover menu at this link: http://www.amishmkt.com {Site is still under construction} How would I make it so that when you are on one of the pages, the background is highlighted like...
by: Applebrown | last post by:
I've got a couple of errors on my site that I'm not sure how to fix. I'm using simple CSS for both text rollovers and my horizontal navbar, and here's what happens. First, the site: ...
by: CK | last post by:
Hello All, I am trying to extend the default asp:ImageButton to include an image for an enabled state and a second image for a disabled state. I currently did this by extending the ImageButton...
by: simchajoy2000 | last post by:
Hi, I am just a javascript beginner so maybe this is a simple problem but I am trying to do some rollovers on images in a separate <div>. Here is the relevent piece of my code: <html>...
by: twst3d | last post by:
Thanks in advance. Not very well versed in javascript but I'm pretty good at piecing together code that works. I am creating a page that has will have definitions on one side and a blank area...
by: Casimir | last post by:
I am looking into making pure CSS image rollovers. Do you have any clever (and robust) CSS rollover-tricks? Or links to such "in the wild"? I have figured out two methods for this, but have...
by: mrking | last post by:
Before I go ahead and implement this I need to confirm that what I want can be done. The standard image rollover works well, however this time I want to modify it to show the current selected...
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 4 Oct 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
by: Aliciasmith | last post by:
In an age dominated by smartphones, having a mobile app for your business is no longer an option; it's a necessity. Whether you're a startup or an established enterprise, finding the right mobile app...
by: giovanniandrean | last post by:
The energy model is structured as follows and uses excel sheets to give input data: 1-Utility.py contains all the functions needed to calculate the variables and other minor things (mentions...
by: NeoPa | last post by:
Hello everyone. I find myself stuck trying to find the VBA way to get Access to create a PDF of the currently-selected (and open) object (Form or Report). I know it can be done by selecting :...
by: NeoPa | last post by:
Introduction For this article I'll be using a very simple database which has Form (clsForm) & Report (clsReport) classes that simply handle making the calling Form invisible until the Form, or all...
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 1 Nov 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM) Please note that the UK and Europe revert to winter time on...
by: nia12 | last post by:
Hi there, I am very new to Access so apologies if any of this is obvious/not clear. I am creating a data collection tool for health care employees to complete. It consists of a number of...
by: GKJR | last post by:
Does anyone have a recommendation to build a standalone application to replace an Access database? I have my bookkeeping software I developed in Access that I would like to make available to other...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.