Oct 05 2009

IE 6 = IE 8?

Tag: CSS, Programy, Przeglądarkiradmen @ 02:29

Posiadanie różnych wersji IE na tym samym profilu nie jest zbyt fajnym rozwiązaniem. Przykładowo IE6 potrafi sobie przejąć część zachowań z IE8, lub innymi słowy mówiąc to IE8 wkrada się w silnik IE6 przez co przeglądarka czasami zachowuje się w sposób nieobliczalny.

Przykładowo: chcę dołączyć (w
komentarzu warunkowym) arkusz styli przeznaczony tylko i wyłącznie dla IE6 (lub niższych). W kodzie wszystko jest poprawnie zapisane, a moje IE jakimś cudem nie łapie zmian. Okazało się, że musiałem zmodyfikować komentarz warunkowy na:

Po tym triku nasz arkusz zostaje załączony. Wychodzi na to, że IE6 renderuje całość wg swoich kryteriów, natomiast identyfikuje się jako IE8. Sprawa trochę kłopotliwa gdyż wprowadza trochę problemów podczas pisania kodu. Można to obejść, lecz trzeba pilnować aby przed wystawieniem na produkcję poprawić ten komentarz warunkowy.

Zamiast instalować kolejne wersje IE można skorzystać z aplikacji
IETester. Program oferuje odpalenie dowolnej strony przy pomocy jednej z wersji IE. Razem z nim jest zainstalowany Debug Toolbar, który potrafi być bardzo przydatny. Wadą tego programu jest to, że czasami potrafi w zadziwiający sposób wyświetlać niektóre strony przez co ciężko jest poprawiać jakiekolwiek błędy.

Myślę, że to najwyższa pora przyłączyć się do frontu likwidacji IE6 =)


Sep 19 2008

Usuwanie wszystkiego przed hashem w URLu (JS)

Tag: HTML, JavaScript, Przeglądarkiradmen @ 04:09

Dzisiaj miałem dość ciekawą sytuację, której rozwiązanie zajęło mi dobre 20 minut. Otóż na linki nałożyłem event onClick. Po kliknięciu na nie odczytywałem z atrybutu ‘href’ co tam w nich jest (dodam, że każdy url miał href’a - “#cos”), usuwałem hash’a i wykonywałem jakąś czynność w zależności od tego co zawierał.

Usuwanie hasha wykonywałem całkiem banalnie. Najpierw za pomocą metody Mootoolsowej pobierałem atrybut ‘href’ (metodą getAttribute) i później już tylko zamieniałem:
href.replace(/#/, '');

Oczywiście Firefox łykał to wszystko bardzo ładnie. Niestety IE7 już nie. Co się okazało ? IE wstawiało do atrybutu href pełen adres przez co zamiast mieć tam “#foo” miałem “http://serwer.com/#foo”. Jak łatwo można się domyślić nie byłem w stanie wyłapać tylko tego co jest za hashem, dlatego trzeba było nieco zmodyfikować pattern na coś takiego:
href.replace(/.*#/, '');

Teraz wszystko gra i efekt jest dokładnie taki jaki miał być :) Dziwne są cuda IE :P

PS. sprawdziłem sobie na innej stronce podobny mechanizm, ale w surowym JSie. Wszystko wskazuje na to, że to JSowe frameworki same wycinają pełną nazwę hosta. Na stronie
jogger.pl odpaliłem z konsoli JS Firebuga taki kod:
document.getElementsByClassName('next')[0].href

Wynikiem był pełen URL, wraz z nazwą hosta. Natomiast wykorzystany na tamtej stronie
jQuery zwracał jedynie wartości od hash’a do końca linii.


Sep 01 2008

IE 8 Beta2 na VirtualPC

Tag: Programy, Przeglądarkidooshek @ 01:40

Właśnie znalazłem info, że wyszła druga wersja beta IE8. Problemem jest to, że po instalacji może nie dać się już go odinstalować (znamy Microsoft prawda? :)

Jest jednak rozwiązanie! Microsoft wspaniałomyślnie
udostępnia obrazy dysku do ich
VirtualPC na których można potestować sobie nie tylko IE8 Beta2 ale też np. IE6!

Nie testowałem jeszcze ale już zaciągam (dla zainteresowanych obrazy będą dostępne na faramirze).


Jul 09 2008

Nowy Fireshot

Tag: Programy, Przeglądarkiradmen @ 08:41
fireshot.png

Niedawno ukazała się nowa wersja rozszerzenia
FireShot. FireShot służy do robienia zrzutów ekranu przeglądanej strony. Rozszerzenie udostępnia sporo możliwości. Poza dodawaniem tekstu, możemy oznaczyć jakiś element strzałką, lub nawet zaznaczyć cały blok i go opisać. Jeśli tego nam mało to możemy pobawić się prostymi efektami graficznymi.

Dawniej FireShot był rozszerzeniem tylko dla
Firefoksa. Wraz z nową wersją mamy możliwość korzystać z tego programu jako rozszerzenie dla IE. Jest to o tyle przydatne, że nie musimy się bawić w robienie zrzutu, wrzucanie go do edytora i zapisywanie. Teraz, dzięki FireShot, możemy bez problemu zaznaczyć to co się krzaczy pod IE, szybko i bezboleśnie :)


Jun 30 2008

Mały ficzer FireBuga

Tag: HTML, JavaScript, PHP, Przeglądarkibuka @ 02:25

Podejrzewam, że nie wszyscy wiedzą, że Firebug ma małą pomocną funkcjonalność “poboczną”, którą niedawno przypadkiem odkryłem. Jak wiadomo, gdyby nie Firebug to debugowanie zapytań ajaxowych byłoby w ogóle masakrą. Dzięki FB jakoś dajemy radę. Można sobie w funkcji zrobić var_dump’a, albo print_r’a i w konsoli FB wyłuskać wynik. Ale ze względu na wyświetlenie w konsoli html’a jako tekstu, var_dump praktycznie odpadał. Ale jeżeli ktoś czuje się bardziej związany emocjonalnie z var_dump’em ;) to w końcu dochodzimy do tego co znalazłem - jeżeli w odpowiedzi na zapytanie w konsoli FB mamy wysyp kodu html, można na nim kliknąć MMB/wałkiem, a Firefox otworzy nam go w nowej karcie, zinterpretowanego i pokolorowanego :)firebug_mmb.png

That’s all, folks :) Mała rzecz, a cieszy ;)

ps. Tylko że nie zawsze to działa… ;P


Apr 02 2008

CSS media=”__” i @media

Tag: HTML, Przeglądarkibuka @ 11:49

Ot ciekawostka, choć przydatna.

Wszyscy wiedzą, że przy ładowaniu arkusza stylów można (a raczej “należy”) podać atrybut media=”all/screen/print/jeszcze_parę_innych”. Pewnie wiele osób, ale może już nie wszyscy, wiedzą że wewnątrz arkusza można też używać deklaracji “@media all/screen/print/itp”. Ciekawostką może być połączenie obu metod - np. mamy arkusz css do wydruków ukrywający nawigację, ale chcemy mieć popup’a z “podglądem” wydruku.

Robimy więc sobie dwa arkusze stylów, jeden standardowy, drugi do wydruku - ukrywający niepotrzebne elementy (nagłówek, nawigację, reklamy itp) lub czyszczący obrazki z tła. Do dokumentu dołączamy oba w sekcji , np:

Teraz bardzo prosto możemy wyświetlić coś, co można traktować jako prosty podgląd wydruku (bez podziału na strony, czy marginesów) - np. dodać do strony link do podglądu kierujący na obecną stronę plus parametr GET’em np ‘?preview=1′. Wystarczy sprawdzać ten parametr przy dodawaniu stylów i kiedy jest on ustawiony zmieniać “media” drugiego arkusza - np. w php:

No dobra, mamy podgląd, to przydałoby się jeszcze móc od razu wydrukować co widzimy. Więc w stronę wrzucamy button “Drukuj” (’onclick=”window.print();return false;”‘) z id=”PrintIt”, standardowo go ukrywamy (w pierwszym arkuszu css #PrintIt{display: none;}), a nasz arkusz css, który miał nam czyścić stronę z tego, co niepotrzebne do wydruku, tym razem powinien nam dodać tego buttona, ale tylko na podglądzie, a nie na samym wydruku. Więc wstukujemy do niego:

No i mamy jedną stronę, podstawowy podgląd wydruku, z dodatkowym buttonem do drukowania widocznym tylko na podglądzie, nie na “standardowej” stronie, czy samym wydruku :)

printcss


Mar 13 2008

Sprawdzanie pisowani w prismie - polski słownik

Tag: Przeglądarkiskowron @ 08:49

Prism polish smallPisząc w gmailu uruchomionym w Prismie maile w języku polskim zawsze brakowało mi jednego… Jak zmusić Prisma do sprawdzania moich wypocin od strony ortograficznej.

Od jednej literówki jeszcze nikomu nic się nie stało, zdarza się. Jednak gdy jest ich już więcej na pewno nie świadczy to o profesjonalizmie adresata i poszanowaniu dla odbiorcy. Jako że sam Prism nie udostępnia interfejsu ustawień.

Zacząłem więc googlować za jakimś rozwiązaniem. Niestety albo źle szukałem albo nie wiele osób próbowało rozwiązać mój problem (lub jest on na tyle banalny że nikt go nie opisuje). Tak więc szybkie i proste rozwiązanie…

Continue reading “Sprawdzanie pisowani w prismie - polski słownik”