Elektronik Devreler: mouse tekerleği ile ileri geri resim oynatma html kodları

MouseWheel resim show ön izleme
Aşağıdaki kodları seç kopyala yapıştır

<img id="slideshow" src="http://elektrosin.com/resim/renaultmegane2008.jpg" />
 
<style>
#slideshow{position:fixed; top:10%; left:20%;}
</style>

//resim dosyaları ekleme alanı//
var r = "http://elektrosin.com/resim";
var myimages=[
    
   
r + "/renaultmegane2008.jpg",
r + "/turksat4a.jpg",
r + "/peugeot_306.png",
r + "/mazda3_2008.png",
r + "/power_led_3w.JPG",
r + "/smd_120_kond.jpg",
r + "/telephone.jpg",
r + "/105k400v.jpg",
r + "/4038ip.jpg",

]
//resim dosyaları ekleme alanı SONU//
 
var slideshow=document.getElementById("slideshow")
var nextslideindex=0
 
function rotateimage(e){
    var evt=window.event || e //equalize event object
    var delta=evt.detail? evt.detail*(-120) : evt.wheelDelta //delta returns +120 when wheel is scrolled up, -120 when scrolled down
    nextslideindex=(delta<=-120)? nextslideindex+1 : nextslideindex-1 //move image index forward or back, depending on whether wheel is scrolled down

or up
    nextslideindex=(nextslideindex<0)? myimages.length-1 : (nextslideindex>myimages.length-1)? 0 : nextslideindex //wrap image index around when it

goes beyond lower and upper boundaries
    slideshow.src=myimages[nextslideindex]
    if (evt.preventDefault) //disable default wheel action of scrolling page
        evt.preventDefault()
    else
        return false
 
}
 
var mousewheelevt=(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel" 
 
if (slideshow.attachEvent) //if IE (and Opera depending on user setting)
    slideshow.attachEvent("on"+mousewheelevt, rotateimage)
else if (slideshow.addEventListener) //WC3 browsers
    slideshow.addEventListener(mousewheelevt, rotateimage, false)
  
</script>

Elektronik Devreler

Ziyaretçi Sayısı

ARAMA YAPIN

13 Ağustos 2016 Cumartesi

mouse tekeri ile resim slayt gösterisi html kodu