Using onMouseOver in a link
- I am able to display a file's contents in a frame.
- I can display an image file in an IMG tag
But I can't figure out how to combine the two. What I want to do is onMouseOver display the contents of a text or html file in a TD element.

In essence:

<a href="#" onmouseover='document.getElementById('ingred2').[I]text[/I]="FileName.htm"'>

<TH id='ingred2'>Display-File-Contents-Here</TH>

Recommended Answers

All 2 Replies

This can be done easily using a combination of Ajax and PHP , see this small solution I made for u and hope that u already familiar with php and ajax

u have index.htm

<!doctype html>
<title>Get File Contents</title>
<script src=""></script>
function get_content()
url: 'file.php',
data:{file: $("#myfile").val()},
success: function(data){


table tr th{
border:1px solid #aaa;

<input type = "file" id="myfile">
<a onmouseover="get_content()" href="#">Get File Get Content</a>

<th id="response"></th>


u have to make anothe file call it file.php that will read the file you select and return their content


$file = $_POST['file'];

echo file_get_contents($file);


Note: u can browse file only from inside the directory of your project or ur php script will complains with an error
how it works: browse the file from inside ur project root then hover over file content link

Of course I can do it with PHP. But you have to have them installed on your server. Not an option.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, learning, and sharing knowledge.