Hy there! I wrote this code:
PHP Code:
$(document).ready(function(){
$(".piece img").hover(function(){
var num = parseFloat(this.id) + 1
this.src = "mintak/minta" + num + "_big.jpg"
$(this).removeClass()
$(this).addClass("bigimg");
},function(){
var num = parseFloat(this.id) + 1
this.src = "mintak/minta" + num + "_small.jpg"
$(this).removeClass();
$(this).addClass("smallimg")
})
})
I know it's not the neatest code ,but works perfectly on localhost in all browsers,but if i upload it to my webhost (it's a free host),onmouseover gives me a rough version of the _big.jpg then both the _small and the _big picture dissapears.Can the free host cause this?I mean maybe it's too slow?
I can't figure it out.I tried to preload the images,i don't know if it's the proper way to do it:
PHP Code:
<script type = "text/javascript" src = "http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type = "text/javascript" src = "demo.js"> //source of the code above
<!--hide from none JavaScript Browsers
Image1= new Image()
Image1.src = "mintak/minta1_big.jpg"
Image2= new Image()
Image2.src = "mintak/minta2_big.jpg"
Image3= new Image()
Image3.src = "mintak/minta3_big.jpg"
Image4= new Image()
Image4.src = "mintak/minta4_big.jpg"
Image5= new Image()
Image5.src = "mintak/minta5_big.jpg"
Image6= new Image()
Image6.src = "mintak/minta6_big.jpg"
Image7= new Image()
Image7.src = "mintak/minta7_big.jpg"
Image8= new Image()
Image8.src = "mintak/minta8_nagy.jpg"
Image9= new Image()
Image9.src = "mintak/minta9_big.jpg"
Image10= new Image()
Image10.src = "mintak/minta10_big.jpg"
Image11= new Image()
Image11.src = "mintak/minta11_big.jpg"
Image12= new Image()
Image12.src = "mintak/minta2_big.jpg"
// End Hiding --></script>
Any help appreciated