+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Problem jQuery pod FF (/thread-problem-jquery-pod-ff)
Problem jQuery pod FF - mateo - 27-10-2012
Witam.
Ostatnio zostałem poproszony o pomoc na pewnej stronie robionej przez innego programistę. Po wykonaniu zlecenia właściciel poprosił mnie, żebym sprawdził jedną rzecz, a mianowicie na stronie http://warzno.pl/index.php/dzialki jest mapka, gdzie wolne działki powinny być oznaczone na zielono, a po najechaniu zielony powinien się rozjaśniać. Problem w tym, że sprawnie działa to tylko na Chromie. Natomiast na Firefoxie początkowe zielone pola widać tylko przy pierwszym ładowaniu strony lub po ctrl+f5. Wszystko inne jest ok. Wydaje mi się, że problem siedzi w tym, że skrypt zaczyna działać w momencie gdy od nowa ładowana jest mapa. Poniżej zamieszczam kod, który jest odpowiedzialny za wyświetlanie punktów na mapie.
Kod PHP:
jQuery(document).ready(function(){
if(!jQuery('#map2').length){
return;
}
jQuery('#cord_map').maphilight({ stroke: false, fillColor: '00ff00', fillOpacity: 1, neverOn: true });
for(var a = 0; a < active.length; a++){
(function(a){
var cord = jQuery('#map_cord_' + active[a]);
cord.data('maphilight', { fillColor: '00d700', stroke: true, strokeColor: 'ffffff', strokeOpacity: 1, strokeWidth: 1, fillOpacity: 0.8, neverOn: false, alwaysOn: true }); // tu dodawane są zielone pola
cord.on({
'mouseover': function(e){
cord.data('maphilight', { fillColor: 'ffffff', stroke: true, strokeColor: 'ffffff', strokeOpacity: 1, strokeWidth: 1,fillOpacity: 0.4, neverOn: false }); // tu dodawane jest rozjaśnienie
tip_active(active[a]);
}, 'mouseout': function(e){
tip_deactive(active[a]);
}
});
jQuery('#map_txt_' + active[a] + ', #map_house_' + active[a]).on({
'mouseover': function(e){
cord.mouseover();
tip_active(active[a]);
}, 'mouseout': function(e){
cord.mouseout();
tip_deactive(active[a]);
}, 'click': function(){
jQuery('#map_cord_' + active[a]).trigger('click');
}
});
})(a);
}
Opisałem w nim 2 miejsca, które są odpowiedzialne za wyświetlanie się pól. Ktoś ma jakiś pomysł jak temu zaradzić?
RE: Problem jQuery pod FF - Kartofelek - 27-10-2012
Spróbuj tak:
- .on zamień na .live
- 'mouseover' na 'mouseenter'
'mouseout' na 'mouseleave'
On niby ma działać "podobnie" jak live ale często gęsto coś się z nim dziwnego dzieje.
RE: Problem jQuery pod FF - mateo - 27-10-2012
@Kartofelek, zmienione, ale problemu nie rozwiązało
Teraz dla zmyłki jest zielone tło, bo właściciel zażyczył sobie podmiany, ale w chormie widocznie widać że mapy wychodzą ponad linie ulic.
EDYTKA
Wszystko wygląda tak, jak gdyby Firefox potrzebował pełnego przeładowania strony (w tym obrazka) by pełen skrypt zadziałał poprawnie.
RE: Problem jQuery pod FF - mateo - 29-10-2012
Jakieś inne pomysły?
RE: Problem jQuery pod FF - Kartofelek - 29-10-2012
Ja jedyny błąd jaki spotykałem to ten spowodowany nie podawaniem atrybutów width i height dla obrazków. Wtedy chrome wali wyliczanie wielkości.
RE: Problem jQuery pod FF - mateo - 29-10-2012
Może przydatne będzie to, że nakreślę trochę jak działa skrypt i co zaobserwowałem.
Kod PHP:
jQuery('#cord_map').maphilight({ stroke: false, fillColor: '00ff00', fillOpacity: 1, neverOn: true });
Ten kod, gdy zamienimy neverOn: true na alwaysOn: true spowoduje, że na wszystkie elementy area na mapie zostanie nałożony kolor. I to działa super i idąc dalej
Kod PHP:
cord.data('maphilight', { fillColor: '00d700', stroke: true, strokeColor: 'ffffff', strokeOpacity: 1, strokeWidth: 1, fillOpacity: 0.8, neverOn: false, alwaysOn: true });
ten kod umieszczony w pętli i przypisany do danego pola area powinien mu nakładać kolor i tak się dzieje, jednak tylko w momencie gdy odświeżywszy stronę w Firefoxie za pomocą ctrl+f5. Przy kolejnych odświeżeniach z użyciem f5 kolory na polach znikają. W chromie wszystko działa bez zarzutu. Wygląda mi to na to, że wszystko działa w momencie gdy odświeżamy całą stronę, łącznie z grafikami. Obejście cache za pomocą PHP też za wiele nie pomogło.
RE: Problem jQuery pod FF - Kartofelek - 30-10-2012
No to może odpal ten skrypt po onload dla tego obrazka?
RE: Problem jQuery pod FF - mateo - 30-10-2012
Cholera brnąłem na ślepo w to jQuery a zwykły JS załatwił sprawę! Dzięki mój superbohaterze!