1. Tudásbázis
  2. Egyéb
  3. Ajax & jQuery

Ajax & jQuery

Beküldte gerisz - 2012. március 30. 12.55
gerisz képe

Üdvözletem!

Ajax lapozó(views) igénybevételekor, a listázott "elemek" egyikén használt, egyszerű jquery animációm megtörik. Miért is?

Bővebben:
views-ban kívánt elemek listázása(blokk)
use ajax (igen)

A title mező "alatt" használnék egy animációt, ami szépen működik is addig amíg nem lapozok.
A jquery minifüggvényt az info fájlban hívom meg. 

(function($){
 
		$(function() {
 
 
			$('.views-fluidgrid-item').hover(function(){
 
				$(this).find('.eventtitle').css({ backgroundColor: 'transparent' });
				});
 
			$('.masonry-brick').hover(function(){
				$(this).find('.queue').animate({ width: "100%" }, {queue: false});
			}, function(){
				$(this).find('.queue').animate({ width: "0" }, {queue: false});
			});
		});
 
})(jQuery);

Segítséget, útmutatást előre is köszönöm.
(Views 7.x-3.3)

Melyik modulhoz, modulokhoz kapcsolódik a téma?: 
views
Fórum: 
Egyéb
alippai képe

Beküldte alippai - 2012. március 30. 13.26

Ne egyszerű (function($){-be helyezd a kódod, mert ha AJAX-ot használsz, akkor a hover() függvényt egy nem létező elemre hívod meg.
Így kell kezelni Drupalban az AJAX-os elemeket:
http://drupal.org/node/756722#behaviors

2
0

Lippai Ádám
young element

Sk8erPeter képe

Beküldte Sk8erPeter - 2012. március 30. 13.26

Azért nem működik az AJAX-szal lekért elemekre, mert azok még nincsenek a DOM-ban akkor, amikor a "hover" eseményre feliratkozol, rákötöd az oldal betöltődése után megjelenő elemekre.

Ezért gondolni kell a "jövőben létrejövő" elemekre is - erre szolgál a jQuery .delegate() függvénye (1.4.3-tól felfelé (tehát a 7-es által alapértelmezettként használt 1.4.4-gyel kell működnie); korábbi: .live(), későbbi (csak 1.7-től felfelé működik): .on()).
Lásd a dokumentációt:
"Attach a handler to one or more events for all elements that match the selector, now or in the future, based on a specific set of root elements."

Valahogy így (csak példa):

$('body').delegate('.views-fluidgrid-item', 'hover', function () {
    $(this).find('.eventtitle').css({
        backgroundColor: 'transparent'
    });
});

Hasonlóan a többire is.
1
-2
gerisz képe

Beküldte gerisz - 2012. március 30. 16.21

Kipróbáltam, azért ezt a megoldást is. Működik.

0
0

Drupal Hétvége 2011

Sk8erPeter képe

Beküldte Sk8erPeter - 2012. március 31. 00.58

Öröm.
Mondjuk a lepontozások indokai ilyenkor érdekelnének, mert ilyenkor ennyiből egy működő megoldás esetén nem tudom, valaki szerint mit rontottam el azonkívül, hogy nem a behaviors-módszert alkalmaztam.
Legalább szakmai fejlődés szempontjából mindenképp hasznos lenne.

(Na sebaj, azért nem adom fel, a segítő szándék megmarad. :) )

1
0
gerisz képe

Beküldte gerisz - 2012. március 31. 12.28

Ne is add fel a segítő szándékodat. Hasznos amit írtál és köszönöm.

Viszont drupal-t használunk és ha van "drupal-os" megoldás akkor azt kell/kellene használni.

Amennyiben másnak is lesz ilyen problémája mint nekem, és ide látogat akkor a pontozásból egyből tudni fogja hogy mi a jó megoldás a drupal-ban.

(A pontozást ne vedd magadra.)

2
0

Drupal Hétvége 2011

Sk8erPeter képe

Beküldte Sk8erPeter - 2012. március 31. 19.54

Igen, bár szerintem abból is teljesen egyértelmű, hogy melyik válasz kapott több pontot. :) Mondjuk én abból indultam ki, hogy a negatív értékelést a magam részéről kifejezetten rossz megoldásokra vagy oda nem illő/félrevezető válaszokra szoktam alkalmazni (a jóra nem, főleg, ha nem is ad hozzá nagy overheadet egy másik lehetséges megoldáshoz). Úgy látszik, még át kell szoktatnom magam a Stack Overflow-n jellemző értékelési rendszerről a drupal.hu-n jellemzőre, és nem elszontyolodni, ha kaptam egy fekete pontot. :)
Egyébként igen, ha Drupal-közelibb megoldás is van, azzal egyetértek, hogy azt alkalmazzuk, abból én is tanulok, ezért is jó itt fórumozni!

2
0
aboros képe

Beküldte aboros - 2012. április 1. 10.01

mikor még 1-1 volt az állás és nem volt más esélyem súlyozni a két megoldást. ne vedd magadra. attól még, hogy valami működik, lehet rossz megoldás.

2
0

-
clear: both;

Sk8erPeter képe

Beküldte Sk8erPeter - 2012. április 1. 11.31

(a másikra nyomott +1 már önmagában súlyozás, de mindegy :P de OK, nem veszem magamra, és nem akadok le ezen :) )
Rendben van, értem én, de még csak arra vagyok kíváncsi, hogy tulajdonképpen ez mitől számít "rossz" megoldásnak? Csakis azért, mert nem használtam benne a Drupal behaviors-t? Azért érdekel, miért "rossz" a megoldás, mert lényegében a jQuery delegate függvénye többek között pontosan ilyen esetekre való. Ebből pedig elvileg az következne, hogy önmagában jó a megoldás, de nem tökéletesen illeszkedik bele a Drupalos koncepcióba (hanem egy alternatíva)...
(Tényleg, félre ne értsétek, nem kötekedni akarok, hanem kíváncsi vagyok a lehetséges okokra.)

1
0
aboros képe

Beküldte aboros - 2012. április 2. 15.57

a két megoldás egyátalán nem egyenértékű, a delegate nem helyettesítheti a standard behaviors megoldást. alippai linkelt már egy szálat ahol erről diskurálnak. még ezt találtam ami elég tömören elmagyarázza: http://stackoverflow.com/questions/3941426/drupal-behaviours

nem azért van a behaviors megoldás, mert jódógukba nem tudták mással elütni az időt az amúgy is gyakran unatkozó core fejlesztők :)

0
0

-
clear: both;

alippai képe

Beküldte alippai - 2012. április 2. 15.18

Itt a diskurzus a te megoldásodról:
http://drupal.org/node/404902

0
0

Lippai Ádám
young element

gerisz képe

Beküldte gerisz - 2012. március 30. 15.39

Köszönöm és köszönöm!

alippai által linkelt http://drupal.org/node/756722#behaviors oldalon a megoldásom 

(function ($) {
 
Drupal.behaviors.exampleModule = {
attach: function (context, settings) {
 // az én részem
}
};
})(jQuery);
3
0

Drupal Hétvége 2011