Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Image and Text display on mouseover

Reply
Thread Tools

Image and Text display on mouseover

 
 
Maxi
Guest
Posts: n/a
 
      04-09-2006
There is a very good javascript available at the following link that
displays image and text wherever mouse follows a link.
http://www.dynamicdrive.com/dynamici...agetooltip.htm

I have a question and not sure who to ask.

I used this script and it is working fine. I changed those two images
and put my own. Image1 is of 600 width and 340 height and Image2 is of
560 width and 794 height.

The code is working fine but the tool tip window resizes automatically
and shows up the image. How can I have a fixed height and width? Which
line should I change so that the height and width of the tooltip window
is constant?

I tried changing var tipWidth = 160; but no effect
tried playing with var startStr = '<table width="' + tipWidth + '"><tr>
but again no effect.

Can anybody help? I want the tooltip window to be constant and the
picture size should be resized to fit in that tooltip window and aspect
ratio for height and width should be resized automatically.

 
Reply With Quote
 
 
 
 
Maxi
Guest
Posts: n/a
 
      04-09-2006
> I changed those two images
> and put my own. Image1 is of 600 width and 340 height and Image2 is of
> 560 width and 794 height.


Here is the link for images
Image1: http://www.picturemounts.co.uk/images/sample.jpg - I named it
as red.jpg
Image2:
http://www.poopsheetfoundation.com/c...d-1-sample.jpg
- I named it as blue.jpg

 
Reply With Quote
 
 
 
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      04-09-2006
Maxi wrote:

> There is a very good javascript available at the following link that
> displays image and text wherever mouse follows a link.
> http://www.dynamicdrive.com/dynamici...agetooltip.htm


Not at all.

> I have a question and not sure who to ask.


| Author: Sharon Paine


PointedEars
 
Reply With Quote
 
optimistx
Guest
Posts: n/a
 
      04-10-2006

"Thomas 'PointedEars' Lahn" <(E-Mail Removed)> kirjoitti viestissä
news:(E-Mail Removed)...
> Maxi wrote:
>
> > There is a very good javascript available at the following link that
> > displays image and text wherever mouse follows a link.
> > http://www.dynamicdrive.com/dynamici...agetooltip.htm

>
> Not at all.
>
> > I have a question and not sure who to ask.

>
> | Author: Sharon Paine
>
>
> PointedEars


You assumably mean that the code is not very good? If so, compared to what?
To code which you could imagine to write if you had some weeks extra time to
write it? Or compared to some existing code? If so,where is it?
I appreciate your opinions with more than 2-10 characters , and I
appreciate your character with more than 2-10 opinions.


 
Reply With Quote
 
Lasse Reichstein Nielsen
Guest
Posts: n/a
 
      04-10-2006
"optimistx" <(E-Mail Removed)> writes:

> "Thomas 'PointedEars' Lahn" <(E-Mail Removed)> kirjoitti viestissä
> news:(E-Mail Removed)...
>> Maxi wrote:
>>
>> > There is a very good javascript available at the following link that
>> > displays image and text wherever mouse follows a link.
>> > http://www.dynamicdrive.com/dynamici...agetooltip.htm

>>
>> Not at all.


> You assumably mean that the code is not very good? If so, compared to what?


It does look bad, based on one of the most traditional signs of bad
Javascript: browser detection.

It doesn't appear to work in my browser (Opera). That's the best argument
against the code (it doesn't work!).
That's a typical result of using browser detection. The code specifically
states:
var nodyn = (!ns5 && !ns4 && !ie4 && !ie5) ? true : false;
I.e., it should only be assumed to work in Netscape 4 or 5
(i.e. Mozilla) and IE 4 or 5.

Luckily for the author, IE 6 manages to make the ie5 variable true,
but it could just as well have not done so. That's one of the dangers
of browser detection - especially if there is no default to use if
detection fails. It is why it fails to show anything in Opera,
although Opera would probably work equally well with code the for IE
and for standard DOM.

> To code which you could imagine to write if you had some weeks extra time to
> write it?


I wouldn't. I would consider using overLib if I needed that
functionality. It's not very good code either (eval-abuse, another
recognized sign of lack of grasp of the language), but it has made the
effort to work in as many browsers as possible and is widely tested.

In a production environment, I would go for stability and being well
tested over being conceptually perfectly pure.

> Or compared to some existing code?


Compared to standards for good code. It shows all the signs of code
that was obsolete when it was written (it's not a new thing that there
are more than two browsers, e.g., Opera has existed since 1996).

/L
--
Lasse Reichstein Nielsen - http://www.velocityreviews.com/forums/(E-Mail Removed)
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
 
Reply With Quote
 
Thomas 'PointedEars' Lahn
Guest
Posts: n/a
 
      04-10-2006
Lasse Reichstein Nielsen wrote:

> "optimistx" <(E-Mail Removed)> writes:
>> [Why http://www.dynamicdrive.com/dynamici...agetooltip.htm is not
>> a "very good javascript" at all?]

>
> It does look bad, based on one of the most traditional signs of bad
> Javascript: browser detection.
>
> It doesn't appear to work in my browser (Opera). That's the best argument
> against the code (it doesn't work!).
> That's a typical result of using browser detection. The code specifically
> states:
> var nodyn = (!ns5 && !ns4 && !ie4 && !ie5) ? true : false;
> I.e., it should only be assumed to work in Netscape 4 or 5
> (i.e. Mozilla) and IE 4 or 5.


On a side note, Netscape 5 was never released. Mozilla/5.x were released,
with Netscape 6.0 being one of the many UAs to be based on it, but those
are -- literally -- completely different animals. I seriously doubt the
author of this code had a minimum clue at all. I see this justified again
when following the author link to <URL:http://www.dyn-web.com/> and reading
the junk code there.


PointedEars
 
Reply With Quote
 
RobG
Guest
Posts: n/a
 
      04-10-2006
optimistx wrote:
>
> You assumably mean that the code is not very good? If so, compared to what?
> To code which you could imagine to write if you had some weeks extra time to
> write it? Or compared to some existing code? If so,where is it?


You can try this:

<URL:http://www.walterzorn.com/tooltip/tooltip_e.htm>


But that is not a recommendation.



--
Rob
 
Reply With Quote
 
VK
Guest
Posts: n/a
 
      04-10-2006

Lasse Reichstein Nielsen wrote:
> It doesn't appear to work in my browser (Opera). That's the best argument
> against the code (it doesn't work!).


It states clearly the tested platforms: FF1+ IE5+ Opr7+, so anyone can
take a dicision if it's enough of coverage or not.

And indeed it works just fine on my Opera 8.5

If for some obscure reasons you also want support for Opera 1.x - Opera
6.x (which is presumably what you have tested on), then you cannot deny
the support for Netscape 4.x neither - btw this script runs just fine
under Netscape 4.5.
It is a good code - it's internal "ugliness" and complexity caused by
Netscape 4.x support. However ever made a working DHTML code for NN 4.x
is entitled for a Medal of Honor, you know Naturally NN4 support is
not needed anymore (as well as say still amateurish Opera 6.x). But
over half of dynamicdrive's codes has been first written during the
Browser Wars and only updated since then. NN4 support doesn't help -
but it doesn't hurt neither, so no problem I guess.

To OP: try to set
tipcss.overflow = 'hidden';
- but it means that the image will be cut if too big.

I would follow the advise of the author: simply pre-set the size to the
biggest image. Or better yet (this is what the real macho do make
all your image of the same size either by resizing them or by setting
the canvas size.

P.S. I'm not the author of this script.

P.P.S. Sorry if I'm sounding grunchy (am I? feel like I am) but I just
hate this a-la former clj stuff of the kind: "I just managed to fail
your script under IE 4.x. (...NN3, Konqueror 1.x, Safari 1.x,
MyFirstBrowser 0.01b ...) yuppy! give me a medal!".

 
Reply With Quote
 
Maxi
Guest
Posts: n/a
 
      04-11-2006
> But that is not a recommendation.

Why not a recommendation? looks like a good script.

 
Reply With Quote
 
RobG
Guest
Posts: n/a
 
      04-12-2006
Maxi said on 12/04/2006 3:19 AM AEST:
>>But that is not a recommendation.

>
>
> Why not a recommendation? looks like a good script.



I think you could extract the bits you want and write something a lot
more concise for your specific requirement (i.e. write an ad hoc
function or object).

Library code must be general and therefore is nearly always verbose,
wz_tooltip.js is no exception. It is based on browser detection and
creates a slew of global variables (60 or so), it may not work well with
other scripts as a result. The first job before deploying it widely
would be to encapsulate all that in a single object.

Having said that, it does work quite well though I've only lightly
tested it.


--
Rob
Group FAQ: <URL:http://www.jibbering.com/FAQ>
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
How to orient mouseover display. DLU HTML 1 01-23-2009 02:03 AM
Display image when mouseover on anchor Hvid Hat HTML 4 09-22-2008 10:20 PM
mouseover change image and text color. Amy Javascript 2 05-20-2006 09:27 AM
mouseover display text with <a> tag Doug HTML 4 03-13-2006 08:15 AM
mouseover image and object sound and preset volume level? murrayatuptowngallery Javascript 4 11-01-2005 10:39 AM



Advertisments