leest Posted December 21, 2007 Share Posted December 21, 2007 Hi, I have never used ajax or Js before and so have no great understanding, i have tried to look for a few tutorials but haven't had much luck in finding any that help. On my website i have some results that are returned from a query, what i am trying to achieve is that when the mouse is run over the id result a mouse over effect occurs and display more information in the pop up window. I have some script that i have pasted below that seems to work to some degree, how ever it doesn't pass the id to the test.php page. Any suggestions or a point in the right direction would be appreciated. Thanks Lee <a href="#" onmouseover="ajax_showTooltip('demo-pages/test.php?id= $id ',this);return false" onmouseout="ajax_hideTooltip()"> echo "$id"; Quote Link to comment Share on other sites More sharing options...
rajivgonsalves Posted December 21, 2007 Share Posted December 21, 2007 post more of your code Quote Link to comment Share on other sites More sharing options...
mbeals Posted December 21, 2007 Share Posted December 21, 2007 This is a little more involved then just ajax. First off, if your calling the same ajax function every time, just with a different var, then define the php path in the function. Here's an example of an ajax function I use all the time: function loadstuff(value) { var xmlHttp; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser does not support AJAX!"); return false; } } } xmlHttp.onreadystatechange=function() { if(xmlHttp.readyState==4) { document.getElementById('divID').innerHTML = xmlHttp.responseText; } } xmlHttp.open("GET","dosomething.php?var="+value,true); xmlHttp.send(null); } Calling the loadstuff(value) function will call dosomething.php and pass in the value of 'value', then put the contents inside the div 'divID'. So further down on the page I would have <div id='divID'></div> In your dosomething.php file you just need: $value = $_GET["var"]; to capture whatever value you just passed in plus and processing and finally an echo command to print out what you want to display. That's the basis....now you want to make it more complex by turning that div into a tool tip. To do this, you will have to use other javascript functions. You will have one function to handle the mouse entering and one for exiting. The function to handle entering will consist of four parts. 1: finding the position of the mouse; 2: setting the position of the div to the found position; 3: running the ajax function to load in the contents; 4: changing the visibilty of the div to show it. The on mouse out part will just consist of changing the visibility of the div again to hide it. all of this is explained here: http://willmaster.com/blog/css/Floating_Layer_At_Cursor_Position.html I also have been looking at this, but have yet to play with it http://www.mojavelinux.com/projects/domtooltip/ Quote Link to comment Share on other sites More sharing options...
leest Posted December 21, 2007 Author Share Posted December 21, 2007 Thank you for your replies and the links, it does look a bit more involved than i realised so i will have a look at the links and see if i can work it out. Thanks for your advice. Lee Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.