Modifier le clic pour passer la galerie à la galerie de photos glissante?

Je viens d'acheter un modèle joomla à partir du modèle monster. il ya une galerie de photos sur la page d'accueil qui saute aux photos en cliquant dessus. Ce dont j'ai besoin est une galerie de photos auto-glissante, vous savez ce que je veux dire automatiquement, sauter des photos dans un intervalle prédéfini. http://www.mirelmuhendislik.com/home-tr/index.php c'est la page d'accueil.Modifier le clic pour passer la galerie à la galerie de photos glissante?

j'ai essayé de le faire par

function clicker() { 
document.getElementById('photo2').click(); 
} 
setInterval("clicker()",5000);

mais cela n'a pas fonctionné. Je ne sais pas pourquoi cela n'a pas fonctionné est-il en raison de javascript embedding options de joomla ou est-ce parce que mon code javascript ?? et comment puis-je résoudre ce problème? je serais heureux de voir quelques suggestions s'il vous plaît aider:/

Source

2010-09-04 Ahmet Yildirim

Dans ce scénario, vous pouvez utiliser .bind() et .trigger()

$(function() { 
    setInterval(function() { 
     $('#slider').trigger('slide'); //triggers 'slide' 
    },2000); //Performs sliding every 2 seconds 
}); 

$('#slider').bind('slide', function() { 
    //write your slide methods 
});

Modifier: Code & Demo page: http://jsbin.com/efoje4

HTML:

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<meta charset=utf-8 /> 
<title>Hello world !!</title> 
    <style type="text/css"> 
    div {margin:0px auto;padding:0px; width:300px;height:200px; overflow:hidden; } 
    ul { margin :0px; padding:0px; list-style:none; width:1200px;height:200px;} 
    li{float : left;margin:0px padding:0px; width:300px;height:200px; } 
    img { margin:0px padding:0px; width:300px;height:200px; }  
    </style> 

</head> 
<body> 
    <div> 
    <ul id="slider"> 
     <li> 
      <img src="http://mystuffspace.com/graphic/adorable-puppies.jpg"/> 
     </li> 
     <li> 
      <img src="http://2.bp.blogspot.com/_TP5pGCYHvfg/SyMRSFukqJI/AAAAAAAAA0Y/yIP62DYXOP8/s400/Puppies.jpg"/> 
     </li> 
     <li> 
      <img src="http://temunot.files.wordpress.com/2008/11/4-cute-puppies-wallpaper-640x480.jpg" /> 
     </li> 
     <li> 
      <img src="http://mystuffspace.com/graphic/puppies-2.jpg" /> 
     </li> 
    </ul> 
    </div> 
</body> 
</html>

JavaScript:

var margin = 0, slider = $('#slider'), width = 300; 

$(document).ready(function() { 
    setInterval(function() { 
     slider.trigger('slide'); 
    },2000); 
}); 

slider.bind('slide',function() { 
    if(margin <= slider.width() *(-1) + width) { 
     margin = 0; 
    }else if(margin <= slider.width()) { 
    margin -= width; 
    } 
    slider.animate({marginLeft : margin},500); 
});

Source

2010-09-04 08:59:33

merci pour le code génial mais:/mon problème est assez différent –

<div class="extra_wrapper"> 
<div id="gallery" class="content"> 
<div class="slideshow-container"> 
<div id="loading" class="loader"></div> 
<div id="slideshow" class="slideshow"></div> 
</div> 
</div> 
<div id="thumbs" class="navigation"> 
<ul id="slider" class="thumbs noscript"> 
<li> <a class="thumb" name="leaf" href="images/stories/big_pic1.png"> <img src="images/stories/gallery_pic1.jpg" /></a></li> 
<li> <a class="thumb" name="leaf" href="images/stories/big_pic2.png"> <img src="images/stories/gallery_pic2.jpg" /></a></li> 
<li> <a class="thumb" name="leaf" href="images/stories/big_pic3.png"> <img src="images/stories/gallery_pic3.jpg" /></a></li> 
<li> <a class="thumb" name="leaf" href="images/stories/big_pic4.png"> <img src="images/stories/gallery_pic4.jpg" /></a></li> 
<li class="last"> <a class="thumb" name="leaf" href="images/stories/big_pic5.png"> <img src="images/stories/gallery_pic5.jpg" /></a></li> 
</ul> 
</div> 
</div>

c'est le script du module qui va galerie de photos sur mon site http://mirelmuhendislik.com/home-tr/ ici quand j'ajoutez votre script, il a déménagé ensemble Photogallery non seulement les photos grand format ce qui suppose de sauter. je veux de petites photos ci-dessous pour rester immobile

Source

2010-09-04 10:45:15

btw que id = "slider" wasnt dans le script par défaut j'ai juste oublié d'enlever désolé –

Au moment où j'ai visité votre site, je ne peux pas accéder à la page, semble que vous êtes encore en train d'installer joomla, pensé que slideShow automatique est suffisant =). Je vais modifier le code :) –

il semble dans ce modèle ils ont utilisé jquery galleriffic bibliothèque peut-être nous pouvons le configurer pour glisser automatiquement dans les paramètres ci-dessous.

var defaults = { 
    delay:      3000, 
    numThumbs:     20, 
    preloadAhead:    40, // Set to -1 to preload all images 
    enableTopPager:   false, 
    enableBottomPager:   true, 
    maxPagesToShow:   7, 
    imageContainerSel:   '', 
    captionContainerSel:  '', 
    controlsContainerSel:  '', 
    loadingContainerSel:  '', 
    renderSSControls:   true, 
    renderNavControls:   true, 
    playLinkText:    'Play', 
    pauseLinkText:    'Pause', 
    prevLinkText:    'Previous', 
    nextLinkText:    'Next', 
    nextPageLinkText:   'Next &rsaquo;', 
    prevPageLinkText:   '&lsaquo; Prev', 
    enableHistory:    false, 
    enableKeyboardNavigation: true, 
    autoStart:     false, 
    syncTransitions:   false, 
    defaultTransitionDuration: 1000, 
    onSlideChange:    undefined, // accepts a delegate like such: function(prevIndex, nextIndex) { ... } 
    onTransitionOut:   undefined, // accepts a delegate like such: function(slide, caption, isSync, callback) { ... } 
    onTransitionIn:   undefined, // accepts a delegate like such: function(slide, caption, isSync) { ... } 
    onPageTransitionOut:  undefined, // accepts a delegate like such: function(callback) { ... } 
    onPageTransitionIn:  undefined, // accepts a delegate like such: function() { ... } 
    onImageAdded:    undefined, // accepts a delegate like such: function(imageData, $li) { ... } 
    onImageRemoved:   undefined // accepts a delegate like such: function(imageData, $li) { ... } 
};

Source

2010-09-04 10:53:47

Oui, il existe un problème d'accès au site avec www. préfixe problème ok résolu i vient de modifier jquery code galleriffic et remplacé

if(this.autoStart) { 
this.play(); 
}

avec

this.play();

vous pouvez demander pourquoi je na pas seulement mis autoStart = 1 bien je l'ai essayé, mais le tir travail je ne sais pas pourquoi

Source

2010-09-04 11:26:31

Modifier le clic pour passer la galerie à la galerie de photos glissante?

Répondre

Questions connexes