İçeriğe geç
ShiftDelete.Net
Haber ara/ SDN'ye SorGiriş
Haber Akışı SDNTV İnceleme Forum Yapay Zeka Akıllı Telefon Elektrikli Otomobil Oyun ShiftDelete.Net Global Teknoloji Haberleri Mobil Otomobil Donanım Savunma Bilim Sosyal Medya İnternet Giyilebilir Teknoloji Rehber Ürünler Son dakika Yazarlar
  1. Ana sayfa
  2. Topluluk
  3. Programlama
  4. Web Programlama (PHP, ASP, HTML, CSS, JavaScript)
Web Programlama (PHP, ASP, HTML, CSS, JavaScript)

Jquery Slider Başa Döndürme

EnverYigit20.11.20141 cevap2.830 görüntüleme
2009'den beri1.540 mesaj
#1
Merhaba, başlıktada belirttiğim gibi slider ekledim siteye herşey istediğim gibi fakat son resimden sonra kayma duruyor, ilk resim gelsin ve kayma devam etsin istiyorum.

DEMO: http://insaatsektoru.esy.es/

Js dosyasını burayada yazayım..

Kullanılan slider: http://www.dhtmlgoodies.com/scripts/image_slideshow/image_slideshow.html
           var displayWaitMessage=true;    // Display a please wait message while images are loading?
      
           
    var activeImage = false;
    var imageGalleryLeftPos = false;
    var imageGalleryWidth = false;
    var imageGalleryObj = false;
    var maxGalleryXPos = false;
    var slideSpeed = -4;
    var imageGalleryCaptions = new Array();
    function startSlide(e)
    {
        if(document.all)e = event;
        var id = this.id;
        if(this.id=='arrow_right'){
            slideSpeedMultiply = Math.floor((e.clientX - this.offsetLeft) / 5);
            slideSpeed = -1*slideSpeedMultiply;
            slideSpeed = Math.max(-10,slideSpeed);
        }else{            
            slideSpeedMultiply = 10 - Math.floor((e.clientX - this.offsetLeft) / 5);
            slideSpeed = 1*slideSpeedMultiply;
            slideSpeed = Math.min(10,slideSpeed);
            if(slideSpeed<0)slideSpeed=10;
        }
    }
    
    function releaseSlide()
    {
        var id = this.id;
        slideSpeed=-1;
    }
        
    function gallerySlide()
    {
        if(slideSpeed!=0){
            var leftPos = imageGalleryObj.offsetLeft;
            leftPos = leftPos/1 + slideSpeed;
            if(leftPos>maxGalleryXPos){
                leftPos = maxGalleryXPos;
                slideSpeed = 0;
                
            }
            if(leftPos<minGalleryXPos){
                leftPos = minGalleryXPos;
                slideSpeed=0;
            }
            
            imageGalleryObj.style.left = leftPos + 'px';
        }
        setTimeout('gallerySlide()',50);
        
    }
    
    function showImage()
    {
        if(activeImage){
            activeImage.style.filter = 'alpha(opacity=50)';    
            activeImage.style.opacity = 0.5;
        }    
        this.style.filter = 'alpha(opacity=100)';
        this.style.opacity = 1;    
        activeImage = this;    
    }
    
    function initSlideShow()
    {
        document.getElementById('arrow_left').onmousemove = startSlide;
        document.getElementById('arrow_left').onmouseout = releaseSlide;
        document.getElementById('arrow_right').onmousemove = startSlide;
        document.getElementById('arrow_right').onmouseout = releaseSlide;
    
        
        imageGalleryObj = document.getElementById('theImages');
        imageGalleryLeftPos = imageGalleryObj.offsetLeft;
        imageGalleryWidth = document.getElementById('galleryContainer').offsetWidth - 80;
        maxGalleryXPos = imageGalleryObj.offsetLeft; 
        minGalleryXPos = imageGalleryWidth - document.getElementById('slideEnd').offsetLeft;
        var slideshowImages = imageGalleryObj.getElementsByTagName('IMG');
        for(var no=0;no<slideshowImages.length;no++){
            slideshowImages[no].onmouseover = showImage;
        }
        
        var divs = imageGalleryObj.getElementsByTagName('DIV');
        for(var no=0;no<divs.length;no++){
            if(divs[no].className=='imageCaption')imageGalleryCaptions[imageGalleryCaptions.length] = divs[no].innerHTML;
        }
        gallerySlide();
    }
    
    function showPreview(imagePath,imageIndex){
        var subImages = document.getElementById('previewPane').getElementsByTagName('IMG');
        if(subImages.length==0){
            var img = document.createElement('IMG');
            document.getElementById('previewPane').appendChild(img);
        }else img = subImages[0];
        
        if(displayWaitMessage){
            document.getElementById('waitMessage').style.display='inline';
        }
        document.getElementById('largeImageCaption').style.display='none';
        img.onload = function() { hideWaitMessageAndShowCaption(imageIndex-1); };
        img.src = imagePath;
        
    }
    function hideWaitMessageAndShowCaption(imageIndex)
    {
        document.getElementById('waitMessage').style.display='none';    
        document.getElementById('largeImageCaption').innerHTML = imageGalleryCaptions[imageIndex];
        document.getElementById('largeImageCaption').style.display='block';
        
    }
    window.onload = initSlideShow;  


Yardımcı olabilirseniz çok sevinirim.
Cevaplar
EnverYigit Konuyu açan
2009'den beri1.540 mesaj
#2
Günceldir arkadaşlar..

Cevabını yaz

Cevap yazmak için giriş yap ya da üye ol. Eski forum kullanıcı adın ve parolanla girebilirsin.