Rozszerzyłem jQuery
wywoływane efekty slideRightShow()
i slideLeftHide()
kilka funkcji, które działają podobnie slideUp()
i slideDown()
jak widać poniżej. Chciałbym jednak również wdrożyć slideLeftShow()
i slideRightHide()
.
Wiem, że istnieją istotne bibliotek, które oferują tego typu rzeczy (chciałbym uniknąć dodając kolejny duży zestaw javascript
plików), ale może ktoś zapewniają prosty przykład jak zaimplementować albo slideLeftShow()
albo slideRightHide()
?
jQuery.fn.extend({
slideRightShow: function() {
return this.each(function() {
jQuery(this).animate({width: 'show'});
});
},
slideLeftHide: function() {
return this.each(function() {
jQuery(this).animate({width: 'hide'});
});
},
slideRightHide: function() {
return this.each(function() {
???
});
},
slideLeftShow: function() {
return this.each(function() {
???
});
}
});
Powyższa slideRightShow
funkcja rozpoczyna wyświetlanie obrazu od lewej strony i postępuje w kierunku prawej strony. Szukam sposobu, aby zrobić to samo, ale zacznij od prawej strony i posuwaj się w lewo . Dzięki!
EDYTOWAĆ
Interfejs jQuery ma coś takiego, czego potrzebuję (w zasadzie potrzebuję ich funkcji „przesuń w prawo” i „wysuń w lewo”), ale nie mogłem sprawić, by działało z jQuery 1.3: http://interface.eyecon.ro/demos /ifx.html . Ponadto ich wersja demonstracyjna wydaje się zepsuta, a slajd tylko raz, zanim wyrzuci milion błędów.
Odpowiedzi:
Ta funkcja jest częścią jquery ui http://docs.jquery.com/UI/Effects/Slide, jeśli chcesz ją rozszerzyć o własne nazwy, możesz jej użyć.
będziesz potrzebować następujących referencji
źródło
Nie zapomnij o dopełnieniu i marginesach ...
Po dodaniu argumentów speed / callback jest to kompletny zamiennik
slideUp()
islideDown()
.źródło
Możesz dodać nową funkcję do swojej biblioteki jQuery, dodając te linie do własnego pliku skryptu i możesz łatwo używać
fadeSlideRight()
ifadeSlideLeft()
.Uwaga: możesz zmienić szerokość animacji, jak chcesz, wystąpienie 750px.
źródło
... = function(opacity, speed, width, fn) {...}
A jeśli chcesz zmieniać prędkość i uwzględniać wywołania zwrotne, po prostu dodaj je w ten sposób:
źródło