Klikalna mapa oraz zaznaczenie punktu
Strona 1 z 2 12 OstatniOstatni
Wyniki 1 do 10 z 13

Temat: Klikalna mapa oraz zaznaczenie punktu

  1. #1
    Bywalec
    Dołączył
    05-07-2012
    Wpisy
    116
    Punkty
    3

    Domyślny Klikalna mapa oraz zaznaczenie punktu

    Utworzyłem sobie mapę w HTML
    <p><img src="" data-src="" usemap="#image-map" /> <map name="image-map">
    <area title="" alt="" coords="292,33" shape="rect" href="/" target="" />
    </map></p>
    Zamist określonego obrzaru,chciałbym zaznaczyć okrelone punkty
    Znalazłem coś podobnego tutaj:
    http://en.wikigta.org/wiki/Weapons_D...istrict_(GTA2)
    ale nie wiem jak to zrobić u siebie.

  2. Pani Reklamowa
    Pani Reklamowa jest aktywna
    Avatar Panny Google

    Dołączył
    19-08-2010
    Skąd
    Internet
    Postów
    milion
    Pochwał
    setki
  3. #2
    Wiarus siristru awatar
    Dołączył
    28-05-2009
    Skąd
    Szczecin
    Wpisy
    2 410
    Punkty
    248

    Domyślny

    Nie zrobisz tego przez znacznik "area" bo nie da się go stylizować.
    Potrzebujesz nałożyć na obrazek div z position: absolute i z określeniem miejsca w pikselach.
    Problem z takim rozwiązaniem jest brak responsywności - obrazek zmniejszy się na mniejszych monitorach a tym samym ustawione pozycjonowanie absolutne zdefiniowane w px się rozjedzie.
    Na Forum pomagam bezpłatnie ad maiorem Joomla gloriam
    Mimo pomocy na forum nie dajesz rady? Potrzebujesz by ekspert "zrobił to" za Ciebie?
    Napisz do mnie na PW. Argentum et Aurum nie zawsze jest konieczne ;)

  4. #3
    Bywalec terra awatar
    Dołączył
    26-05-2017
    Skąd
    Wrocław
    Wpisy
    448
    Punkty
    50

    Domyślny

    Podajesz przykład i masz w nim odpowiedź. Mapa zbudowana jes z Div'ów osadzanych względem górnego lewego narożnika komórki tabeli. Punkty na mapie to animowane gify, które również osadzane są względem narożnika.
    Responsywność można rozwiązać poprzez definicję reguły @media na różną rozdzielczość, a tym samym każdorazowe definiowanie własności position dla pozycjonowanego elementu.
    Jeśli masz
    Kod:
    <div id="nr1" style="position: relative; left: 0px; top: 0px; width: 0px; height: 0px; visibility: visible;">
    to musisz zdefiniować wersje stylów DIV nr1 dla wszystkich rozdzielczości. W praktyce masz rozdzielczości desktop,tablet,komórka, czyli dla każdego DIVa musisz mieć 3 definicje tej samej pozycji DIV nr1 desktop | DIV nr1 tablet | DIV nr1 komórka.

    W Twoim przykładzie jest ok 50 ramek div więc masz conajmniej 150 definicji stylów.

  5. #4
    Wiarus siristru awatar
    Dołączył
    28-05-2009
    Skąd
    Szczecin
    Wpisy
    2 410
    Punkty
    248

    Domyślny

    Cytat Wysłane przez terra Zobacz wiadomość
    W Twoim przykładzie jest ok 50 ramek div więc masz co najmniej 150 definicji stylów.
    Czemu tak skromnie? Tylko 50 x 3

    Używam jedynie:

    @media only screen and (min-width:360px) {}
    @media only screen and (min-width: 568px) {}
    @media only screen and (min-width: 667px) {}
    @media only screen and (min-width: 768px) {}
    @media only screen and (min-width: 1024px) {}
    @media only screen and (min-width: 1224px) {}
    @media only screen and (min-width: 1440px) {}

    A możliwych jest o wiele więcej... no i nie przewidzisz każdego urządzenia.

    Tylko w tym przykładzie mam7 50 x 7 = 350

    A możemy się bawić: http://responsivetesttool.com/

    Ale nie wiem czy jest jednak jakiś inny sposób?
    Na Forum pomagam bezpłatnie ad maiorem Joomla gloriam
    Mimo pomocy na forum nie dajesz rady? Potrzebujesz by ekspert "zrobił to" za Ciebie?
    Napisz do mnie na PW. Argentum et Aurum nie zawsze jest konieczne ;)

  6. #5
    Bywalec terra awatar
    Dołączył
    26-05-2017
    Skąd
    Wrocław
    Wpisy
    448
    Punkty
    50

    Domyślny

    Cytat Wysłane przez siristru Zobacz wiadomość

    Ale nie wiem czy jest jednak jakiś inny sposób?
    Właśnie.
    Ale w tej chiwili pomyslałem, że można spróbować osadzić CSS w PHP i wartości px kalkulować automatycznie na podstawie danej rozdzielczości.

  7. #6
    Wiarus siristru awatar
    Dołączył
    28-05-2009
    Skąd
    Szczecin
    Wpisy
    2 410
    Punkty
    248

    Domyślny

    Cytat Wysłane przez terra Zobacz wiadomość
    Ale w tej chiwili pomyslałem, że można spróbować osadzić CSS w PHP i wartości px kalkulować automatycznie na podstawie danej rozdzielczości.
    To jest też rozwiązanie... ale czy to nie wymaga użycia CSS inline?

    Może jeszcze próbować rozwiązać przez jQuery.
    Na Forum pomagam bezpłatnie ad maiorem Joomla gloriam
    Mimo pomocy na forum nie dajesz rady? Potrzebujesz by ekspert "zrobił to" za Ciebie?
    Napisz do mnie na PW. Argentum et Aurum nie zawsze jest konieczne ;)

  8. #7
    Bywalec terra awatar
    Dołączył
    26-05-2017
    Skąd
    Wrocław
    Wpisy
    448
    Punkty
    50

    Domyślny

    Cytat Wysłane przez siristru Zobacz wiadomość
    To jest też rozwiązanie... ale czy to nie wymaga użycia CSS inline?
    Nie - robimy sztuczkę w której plik style.css zamieniamy na style.php, a w środku osadzamy nagłówek
    Kod:
    header("Content-type: text/css; charset: UTF-8");
    i od tej pory grzejemy css w php

  9. #8
    Wiarus siristru awatar
    Dołączył
    28-05-2009
    Skąd
    Szczecin
    Wpisy
    2 410
    Punkty
    248

    Domyślny

    @terra: dobre, dobre
    Na Forum pomagam bezpłatnie ad maiorem Joomla gloriam
    Mimo pomocy na forum nie dajesz rady? Potrzebujesz by ekspert "zrobił to" za Ciebie?
    Napisz do mnie na PW. Argentum et Aurum nie zawsze jest konieczne ;)

  10. #9
    Bywalec
    Dołączył
    05-07-2012
    Wpisy
    116
    Punkty
    3

    Domyślny

    Widzę że temat rozwinął się w ciekawym kierunku.
    Mozemy doprowadzíć go do końca.
    Jak w PHP określać szerokość ekranu?

  11. #10
    Wiarus siristru awatar
    Dołączył
    28-05-2009
    Skąd
    Szczecin
    Wpisy
    2 410
    Punkty
    248

    Domyślny

    Ten php to faktycznie będzie CSS czyli stosujesz zwyczajne break points jak wypisałem tutaj: http://forum.joomla.pl/showthread.ph...l=1#post385932
    Na Forum pomagam bezpłatnie ad maiorem Joomla gloriam
    Mimo pomocy na forum nie dajesz rady? Potrzebujesz by ekspert "zrobił to" za Ciebie?
    Napisz do mnie na PW. Argentum et Aurum nie zawsze jest konieczne ;)

Strona 1 z 2 12 OstatniOstatni

Podobne tematy

  1. Klikalna mapa Polski
    przez Jarekkal na forum Rozszerzenia - problemy z obsługą, zarządzaniem
    Odpowiedzi: 14
    Ostatni post/autor: 26-07-2017, 11:48
  2. Klikalna mapa województw - ustawienia
    przez cechupsp na forum Rozszerzenia - problemy z obsługą, zarządzaniem
    Odpowiedzi: 3
    Ostatni post/autor: 17-02-2015, 14:56
  3. Klikalna mapa iPolski
    przez mireczek113 na forum Rozszerzenia - problemy z obsługą, zarządzaniem
    Odpowiedzi: 10
    Ostatni post/autor: 18-12-2012, 19:45
  4. Klikalna mapa województw
    przez kasro na forum Rozszerzenia - problemy z obsługą, zarządzaniem
    Odpowiedzi: 14
    Ostatni post/autor: 15-05-2012, 12:43
  5. Klikalna mapa województw - link do województwa.
    przez Paulo1982 na forum Rozszerzenia - problemy z obsługą, zarządzaniem
    Odpowiedzi: 0
    Ostatni post/autor: 19-04-2011, 16:09

Reguły pisania

  • Nie możesz zakładać nowych tematów
  • Nie możesz dodawać wypowiedzi
  • Nie możesz dodawać załączników
  • Nie możesz poprawiać swoich postów
  •