Jump to content

jeankaleb

New Members
  • Posts

    2
  • Joined

  • Last visited

jeankaleb's Achievements

Newbie

Newbie (1/5)

0

Reputation

  1. What do you mean by std html tag. I have the image path stored in a mysql table, using a while loop to display the image values on the screen with an img src tag. What i need now is a hover scrip which will display the data corrisponding to the image displayed. ucurrently on hover I have all yte values displayed as opposed to each selected item value
  2. It is my aim to accomplish the following: * A user logs onto a social media site. * Clicks on a "Member" link. a list of member images are presented. * The userthen uses their mouse to hover over an image. * The profile information for a specific user is displayed (i.e.) the image the user has their mouse hovered on Namely: Firstname, Lastname (as an example) I have accomplished the following [still a rough draft per-se'] * Established a DB Connection * Established a CSS tooltip structure * Using a WHILE LOOP via Php displayed the images onto the screen forthe user to see. In addition having a hover tooltip function that when the user places their mouse over an image a blank tooltip appears. As mentioned. What I would like is the data corrisponding to a particular user populate the tooltip when the on hover event is made active. <?php session_start(); ?> <?php ob_start(); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <?php include("include/dbconn.inc");?> <style type="text/css"> .tooltip { display: inline; position: relative; } .tooltip:hover:before { border: solid; border-color: #333 transparent; border-width: 6px 6px 0 6px; bottom: 20px; content: ""; left: 50%; position: absolute; z-index: 99; } .tooltip:hover:after { background: #333; background: rgba(0,0,0,. ; border-radius: 5px; bottom: 26px; color: #fff; content: attr(title); left: 20%; padding: 20px 15px; position: absolute; z-index: 98; width: 220px; } </style> </head> <body> <!--The line of code below allows the tooltip to be nstantiated--> <a href="#" title="<?php echo(" "); ?>"; class="tooltip"> <?php // The code below is a Php While loop which will itterate though the MySQL table and display the images from the table field. // run query $query = mysql_query ("SELECT * FROM users"); // set array $array = array(); // look through query while($row = mysql_fetch_assoc($query)) { // add each row returned into an array $array[] = $row; // assign the contents of the array values [ProfileImagePath] to a variable $userProfilePics = $row['ProfileImagePath']; // Displays array content retreived from database to the screen echo "<img src=".$userProfilePics." height='100px' width='100px' hspace='20' vspace='20'>"; } ?> </a> </body> </html>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.