inny wygląd strony w różnych przegladarkach

0

witam,

czy ktoś może wie dlaczego strona: http://www.mogrodowski.pl/budman/ wygląda różnie w przeglądarkach Opera, Firefox i Chrome? Jedynie w Operze wygląda poprawnie.

Z góry dzięki za podpowiedzi.

0

Ciężko mi się debuguje w czymkolwiek innym niż Operze, a na niej akurat działa poprawnie, ale coś masz ładnie skopane od podstaw pewnie.
Nie wiem po co elementy #projekt_szary itd. mają ustalone tło, skoro w nich i tak masz obrazki - wywal to.

1

@dzek69: Ale i tak raczej nie będzie równo po wywaleniu tego niepotrzebnego tła -- obrazki będą wciąż nachodziły lekko na napis.

Troszkę tu igrasz z ogniem, @G1T. Używasz pozycjonowania bezwzględnego dla obrazków, ale nie definiujesz left i top, pozwalając, by obrazek pojawił się tam, gdzie pojawiłby się gdyby uczestniczył w normalnym przepływie dokumentu (jak przy position: static), tyle że bez zajmowania miejsca w tym przepływie.

Element zawierający obrazki ma kosmiczne marginesy i wymiary ustalone tak, żeby niby to "normalne miejsce" dla obrazka wypadało tam, gdzie chcesz. Tyle że obrazki domyślnie mają display: inline i nie są pozycjonowane jak elementy blokowe. Nadanie obrazkom display: block mogłoby tu o dziwo pomóc, bo ujednolica pozycjonowanie obrazków w normalnym przepływie.

Prawdopodobnie lepiej by tu było użyć pozycjonowania bezwzględnego z left i top. Pamiętaj tylko, żeby element zawierający (takimi elementami są te divy z ID-kami) miał przynajmniej position: relative. Z tego co widzę, to te elementy zawierające są tak wypozycjonowane, że obrazkom wystarczy wtedy dać left: 0; top: 0.

0

@bswierczynski, dzięki za podpowiedź, wystarczyło nadać obrazkom własność display:block. Dzięki!

0

a czy może wiesz, dlaczego nie działa JavaScript w Chrome i Firefox? W Operze po najechaniu na napisy: PROJEKT, WYKONAWSTWO, SPRZEDAŻ obrazki powiększają się, natomiast w pozostałych już nie. Adres: www.mogrodowski.pl/budman/

0

Radzę też poczytać:
http://en.wikipedia.org/wiki/Unobtrusive_JavaScript

Bo generalnie unika się JS w znacznikach HTML :)

U mnie powiększanie obrazków działa jak się najedzie na obrazki, na napisy nie działa mi nigdzie.

0

zobacz jak wyglada twoja funkcja do powiekszania obrazkow:

function powieksz_obraz(dzial){
document.getElementById(dzial+'szary').style += "-webkit-transform:scale(1.4);-moz-transform:scale(1.4);-o-transform:scale(1.4);-ms-transform:scale(1.4); ";
document.getElementById('o
'+dzial).style = "z-index:3";
}

wiesz co zwraca te wyrazenie w Firefoxie z powrotem?

document.getElementById(dzial+'_szary').style + "-webkit-transform:scale(1.4);-moz-transform:scale(1.4);-o-transform:scale(1.4);-ms-transform:scale(1.4); ";

zwraca ten String:

"[object CSSStyleDeclaration]-webkit-transform:scale(1.4);-moz-transform:scale(1.4);-o-transform:scale(1.4);-ms-transform:scale(1.4);"

Nie ma sie co dziwic, ze w Firefoxie to nie funktionuje.
Uzywasz JQuery, dlaczego nie zrobic za pomoca tego frameworku jakiejs animacji?

1 użytkowników online, w tym zalogowanych: 0, gości: 1