Spotlight a HTML element

Status: Closed
Prize: $12
Entries Received: 4
Winner: deannielsen

Winner

Contest Brief

I want to spotlight an HTML element. The spotlight will be a CSS animation with a certain color.
When I click on an item I want the spotlights to shine on the item from the spotlight in the corners to the item.

Extra attention is given to you if you use jQuery to pass in a color
Extra attention is given to you if you use jQuery move the spotlight in the corners

Make sure the CSS does not cause a horizontal or vertical scroll bar to appear.

Use the attached CSS to start with, which is a lot of the work

Please have the 2 corner spotlights show a beam of light to the element the user clicked on. In the attached image you can see if they click on ITEM1 then the 2 corner spotlight should show a beam of light from the corner to ITEM1. Likewise for the other links.

Recommended Skills

Winner

Post a Contest Like This

Employer Feedback

“Did most of the work. ”

devalphabeta, United States.

Public Clarification Board

deannielsen
- 8 years ago
I have sent the new html file to you via email...
- 8 years ago
deannielsen
- 8 years ago
The spotlights now show a beam of light to the element the user has clicked on..
Have sent the new updated code via email...
- 8 years ago
1. Contest Holder
  - 8 years ago
  Can you please update this. - See comment Hi - Getting there. Please enhance the attached code to do this spotlight. I do not want to have fixed position spotlight items, Item1, Iterm2, Item3. The jQuery should calculate the angle and distance from the Lamp(s) to Item clicked and dynamically change the CSS. Also, make sure all other beams are hidden and only the clicked on item has a beam of light and spotlight.
  I removed the blue and red moving spotlights, not needed. See the code I sent you in your email
  - 8 years ago
Contest Holder
- 8 years ago
Hi - Getting there. Please enhance the attached code to do this spotlight. I do not want to have fixed position spotlight items, Item1, Iterm2, Item3. The jQuery should calculate the angle and distance from the Lamp(s) to Item clicked and dynamically change the CSS. Also, make sure all other beams are hidden and only the clicked on item has a beam of light and spotlight.
I removed the blue and red moving spotlights, not needed. See the code I sent you in your email
- 8 years ago
Contest Holder
- 8 years ago
I actually need this done in 3 days, not 7. Thanks.
- 8 years ago
1. huykon225
  - 8 years ago
  you do not want 2 blue and red, but instead just the only one color?
  - 8 years ago
2. Contest Holder
  - 8 years ago
  Hi - see the notes in project. 2 blue is fine. I can change the css
  - 8 years ago
deannielsen
- 8 years ago
I sent you a new email yesterday - and I have resent it today for you...
- 8 years ago
deannielsen
- 8 years ago
updated coding...
now shines from the corner...
- 8 years ago
deannielsen
- 8 years ago
updated coding
--does not follow mouse cursor
--can change color
--only appears on mouse hover...
- 8 years ago
Contest Holder
- 8 years ago
I want to be able to have any color.
- 8 years ago