|
|
|||||||||
|
|||||||||
| |||||||||
|
|
|
| |||||||||
![]() |
|
|
«
Previous Thread
|
Next Thread
»
|
Thread Tools | Search this Thread | Rate Thread | Display Modes |
|
#1
|
|||
|
|||
|
Other - Displaying both text and image at event, onMouseover.
Recently I got very good help with a Mouseover problem here at this Forum (by mikeyskona).
I fell in love with the function onMouseover so now I want to do something a little bit more complicated. Background: I display a list of members of a board and onMouseover the name I want to display a little “window” containing a picture of the person, the name and a short description of the persons background. I use PHP and a Javascript from http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip.htm. I keep the information of each person in an MySQL databse, in a table named styrelse. The table is built up by 5 fields: Fnamn, enamn, funktion, picture and description. The fields are fetched from the database and put into an array ($styr1). Like this: Code:
$styr1=mysql_query("SELECT * FROM styrelse WHERE funktion IS NOT NULL ORDER BY funktion ASC");
To display the text and make the mouseover work for the text part is no problem. What I am not able to do is to combine the text with the image, if that is possible. Here is the relevant part of the code: Code:
<table border="0" cellpadding="3">
<?php
while($strad1=mysql_fetch_row($styr1)){
echo '<tr>
<td>'.$strad1[0].'</td>
<td width=270 onMouseover="ddrivetip(\'<b>'.$strad1[0].''.$strad1[1].'</b><br>'.$strad1[2].'<br><br>'.$strad1[4].'\' ,\'white\', 500);"
onMouseout="hideddrivetip()">'.$strad1[1].'</td><td>'.$strad1[2].'</td></tr>';
}
?>
Something like this: Code:
<img src="../bilder/sw130.jpg" alt="" height="160" width="130" border="0"> To make it flexible I need to point to the image thru a link in the field picture $strad1[4]. Perhaps like this: Code:
<img src="$strad1[4] " alt="" height="160" width="130" border="0"> I can not make this work. Perhaps I am on the wrong track? Maybe I use the wrong JavaScript. My knowledge of JavaScripts is very limited. Do someone have a better suggestion? |
|
#2
|
||||
|
||||
|
It sounds like you want to modify the image on mouseover to include their name, and not just make a pop-up tool-tip style item with their name in it. This would require some ajax, or similar technology to make a php call to modify the image and send the new image name to javascript which would then load it. Depending on the speed of your server this may take quite some time, especially on th edevelopment box since image manipulation isn't a simple task for the proc. Once hosted it should be seamless.
__________________
Will code for food or
|
|
#3
|
||||
|
||||
|
Not sure if this is a limitation of your popup-script, but with overlib you can set images, text, titles, and everything with extreme ease.
__________________
FREE Web Development Videos | PHP Reference | MySQL Reference | jQuery Documentation Markup Validation | CSS Validation | Web Developers, get FireBug & IE Developer Toolbar When seeking help: Submit clear questions and code. Use syntax highlighting. Be patient, and respectful. Don't abuse your access to professional guidance - nobody here is obligated to answer your questions, be thankful that they do. Are you a good person? |
|
#4
|
|||
|
|||
|
Hello again
.i'm not completely sure what you're trying to acheive here, are you trying to make the image "popup" on mouseOver of something? or are you just trying to make it change an image in a certain area of the page on mouseover? making the image popup is possible, but a tiny bit more tricky than just making an image on the page change ![]() The simplest method would be a single div (with an id) then having the mouseover change the content of the div.. You may end up with a little x for a second or so until the image has loaded (unless you use a pre-loader, but with lots of images that could make the page take a while to load). The other option is with ajax, which we could probably go through reasonaby simply. The beauty of ajax is that you can get javascript to load content of another page inside an element within your web page. Give us a good idea of exactly what you want to happen and we'll help you get it there ![]() |
|
#5
|
|||
|
|||
|
I want an image and a text to popup on mouseover. Both the text and a link to the image is stored in the same record in the database.
Ther will be 10 to 12 records in the DB containing different text and image-links. This is to present persons with a photograph and some background. |
|
#6
|
||||
|
||||
|
When you generate the page just add the items you want to the page and set their style to display:none; and when you mouse over just display:block;. You will have to set their position and whatnot.
|
![]() |
| Viewing: Dev Shed Forums > Programming Languages > PHP Development > Other - Displaying both text and image at event, onMouseover. |
| Thread Tools | Search this Thread |
| Display Modes | Rate This Thread |
|
|
|
|
|