Unë e kam këtë imazh për një rrëshqitës. Unë dua që ajo të zbehet në imazhin tjetër pasi të klikohet butoni. JQuery bën që imazhi të zbehet brenda dhe jashtë për ta bërë kalimin më të pastër kur ndryshon src. Megjithatë, imazhi mbetet i njëjtë pas zbehjes.
HTML
<button onclick = "prev()" id = "prev">Prev</button>
<img id = "slider" src = "" height = "600px" width = "600px"/>
<button onclick = "next()" id = "next">Next</button>
JQuery
var images = ['', '', ''];
var num = 0;
function next() {
var slider = $('#slider');
num++;
if(num >= images.length) {
num = 0;
}
slider.fadeOut('slow', function() {
slider.src = images[num];
slider.fadeIn('slow');
});
}
function prev() {
var slider = $('#slider');
num--;
if(num < 0) {
num = images.length-1;
}
slider.fadeOut('slow', function() {
slider.src = images[num];
slider.fadeIn('slow');
});
}
I kam nxjerrë imazhet me të cilat i kam testuar pasi lidhjet e tyre ishin shumë të gjata. Tre imazhet rrëshqitëse do të jenë në variablin "imazhe" të JQuery dhe ajo fillestare në imazhin src.