473,387 Members | 2,436 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

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

Mouseover Photo Shall Display Nicely Designed Metadata

Hi there,

I have a photoblog here . When one has the mouse over the photo it displays some metadata, as for example the exposure time, the ISO etc...

This is how it looks like in the moment:



And this is how I would like ot have it:



Any way to build this kind of image-text-mixture with CSS & Javascript?

Thanks for any advice!
Aug 7 '07 #1
5 1478
acoder
16,027 Expert Mod 8TB
You won't be able to use the title attribute for that. You will need to create a div and use that to store images and text. You can change the src of the images to reflect the current values.

Do you want the display div to follow the mouse or appear in a fixed position on the photo?
Aug 7 '07 #2
Do you want the display div to follow the mouse or appear in a fixed position on the photo?
It would surely be nice to follow the mouse. But I guess this is much more difficult to achieve. So, the second approach should be sufficient (for the beginning... :-))
Aug 8 '07 #3
acoder
16,027 Expert Mod 8TB
You can create your own tooltips or use one that's already been written. Google for "javascript tooltip".
Aug 8 '07 #4
Oh, thanks a lot. Great tip. Looks awesome now!
Aug 8 '07 #5
acoder
16,027 Expert Mod 8TB
Oh, thanks a lot. Great tip. Looks awesome now!
Yes, it looks nice. Glad you got it working. Post back anytime if you have more problems. Sometimes it's just a case of knowing what to search for.
Aug 8 '07 #6

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

Similar topics

3
by: Ken | last post by:
I have a database called autographs.mdb that is in the "XYZ" folder in the "database" folder. I have a form in the database that I want to display a photo of the celeb on. The photos are in a...
3
by: bob garbados | last post by:
I'm looking for thoughts on photo galleries and security/performance implications... I'm working on an asp.net site in vb that will include an updateable photo gallery that will display thumbnails...
3
by: Guadala Harry | last post by:
Here's the functionality I'm after: I need for a page to display a photo. When users click on other links within the page, the photo changes. I'd like to swap out the photo without doing a...
7
by: Eric Lindsay | last post by:
I would like to do a photo gallery with a liquid layout. I wanted to center a caption below each photo (or above each photo). I can do that easily with tables, but then I don't have a liquid...
1
by: desjardins.daniel | last post by:
Hi ! Excuse my english, i'm a french canadien... So here my message : I have put on my site a photo gallery and at the right a nav menu. This menu has a red dot visible want someone is passing...
5
by: NJonge01 | last post by:
Greetings, I've read some great advice on similar topics, just nothing matching exactly what I'm trying I'm pretty close I think on making this work, but note quite there. I want to print a...
11
by: gdp | last post by:
hi - hope someone can suggest a way round this see http://www.tidybit.com/public/ this is a stripped down version of a site i am doing. when you mouseover the artist names on the left - the...
1
by: cumupkid | last post by:
II am trying to create a form that will allow me to upload photos to a folder in the site root directory and add the information to the mysql db at the same time. I have created two forms, one...
2
by: sasimca007 | last post by:
Hello friends, I know that an image can used as link. But what my doubt is, when mouse moves on a link it should display an image corresponding to that link, and in tha place...
0
by: taylorcarr | last post by:
A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...
0
by: aa123db | last post by:
Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

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.