Can anyone help me to get the onmouseovers working in the below code?
I am loading html files to disblay as thumb-nails (one html file = one thumb-nail) , which also have popups tied to them - that is to say the thumb-nails have popups that appear when you hover over them.
One of my html file's content(full contents) looks like:
<div class='box'><a href="Shop/Product_Pics/car.jpg"><img id="thumb_entry_No0" runat="server" onmouseover="pop0.className='popup'" onmouseout="pop0.className='hidden_popup'" src='Shop/Product_Thumbs/Thumb_car.jpg' style="border:1px solid black;" alt='' title="Toy Car" longdesc='Shop/Product_Thumbs/Thumb_car.jpg'/></a> <div id="pop0" class="hidden_popup" runat="server"><p><img class="thumbs2" src="Shop/mid_size/mid_car.jpg" style ="border:1px solid black;" alt="" /> <br/>This old-fashioned wooden toy car can be made to order by a Crafts man who has a small shop in the Teddington area of West London. </p><p>Crafts-man: FG<br/>Description: Old style Toy Car<br/>Size: 4''W by 5''H by 6''L </p><p>Shop Price: £25 <br/>P&P: £8 (UK & IRE)</p> </div></div>
And I am loading the html pages / thumbs into my aspx page using:
<!-- infinite scroll gallery -->
<div class="ajaxscroll" id="example_horizontal">
</div>
<script type="text/javascript" src="js_4_scroll/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js_4_scroll/jquery.ajaxscroll.min.js">
</script>
<script type="text/javascript">
$(function () {
$('#example_vertical').ajaxScroll({
updateBatch: updateVertical
});
$('#example_horizontal').ajaxScroll({
horizontal: true,
batchNum: 9, // number of items/thumbs to start with - maybe +
batchSize: 1,
maxOffset: 18, // number of items/thumbs to display - maybe
updateBatch: updateHorizontal
});
});
function updateHorizontal($obj) {
$obj.load('hdata/' + $obj.attr('offset') + '.html');
// $obj.load('hdata/0.html');
}
function updateVertical($obj) {
$obj.load('vdata/' + $obj.attr('offset') + '.html');
// $obj.load('hdata/0.html');
}
</script>
<!-- end of scroll gallery -->
The problem is that the thumb-nails' popups can be triggered to appear from a pic/element on my aspx page - outside of the loaded html files' area -
using the same "onmouseover="pop0.className='popup'"" code, but when the code is inserted into the aspx page from the html file, the code somehow doesn't work
right so as to display the popups... Any tips on how to get the popups to show when I hover over one of the loaded thumb-nails?