Temat: menu z obrazka

jak zabrać się do zrobienia menu w postaci obrazka, na którym różne elementy odnoszą do różnych stron? na przykład wstawiam grafikę z mapą i chcę, zeby po najechaniu i kliknięciu na jakiś kraj użytkownik został przekierowany do odpowiedniej podstrony. Próbowałem w photoshopie, pociąłem zdjęcie i przypisałem odpowiednie url, ale jak zapiszę zdjęcie w formacie gif czy jpg to odnośnika nie ma.

proszę fachowców o pomoc ;)

konto usunięte

Temat: menu z obrazka

Czy chodzi Ci o mapowanie obrazków? :)
Wojciech J.

Wojciech J. mistrz wwwujitsu

Temat: menu z obrazka

Teorię w zasadzie podał Rafał.
Jeśli chcesz sobie uprościć nieco dłubaninę, skorzystaj z generatora.
Ten jest dobry: http://www.maschek.hu/imagemap/imgmap

Temat: menu z obrazka

.Sławomir Winiecki edytował(a) ten post dnia 17.02.11 o godzinie 13:22

Temat: menu z obrazka

Wojciech J.:
Teorię w zasadzie podał Rafał.
Jeśli chcesz sobie uprościć nieco dłubaninę, skorzystaj z generatora.
Ten jest dobry: http://www.maschek.hu/imagemap/imgmap

dokładnie o to chodziło, ale sam dokładnie nie wiedziałem czego szukam :) dziękuję za pomoc!

pojawia sie teraz pytanie jak i w którym miejscu wstawić wygenerowany kod.dodam, ze działam na WP
Wojciech J.

Wojciech J. mistrz wwwujitsu

Temat: menu z obrazka

Sławomir Winiecki:
pojawia sie teraz pytanie jak i w którym miejscu wstawić wygenerowany kod.dodam, ze działam na WP

Wygenerowany kod to czysty html.
A w którym miejscu go wstawić, to już sam powinieneś określić.
Jeśli to ma być wklejone w notce, to podczas redagowania wpisu w edytorze wybierasz opcję podglądu źródła i tam wklejasz kod z mapą obrazu.

Jeśli chcesz ją wkleić w bocznym pasku (sidebar) wtedy edytujesz plik sidebar.php i w odpowiednim miejscu, w którym ma być wyświetlana mapa, wklejasz jej kod.
Byleś go tylko nie wlepił w środek skryptu php, bo się wysypie cały serwis.

Temat: menu z obrazka

Wojciech J.:
Sławomir Winiecki:
pojawia sie teraz pytanie jak i w którym miejscu wstawić wygenerowany kod.dodam, ze działam na WP

Wygenerowany kod to czysty html.
A w którym miejscu go wstawić, to już sam powinieneś określić.
Jeśli to ma być wklejone w notce, to podczas redagowania wpisu w edytorze wybierasz opcję podglądu źródła i tam wklejasz kod z mapą obrazu.

Jeśli chcesz ją wkleić w bocznym pasku (sidebar) wtedy edytujesz plik sidebar.php i w odpowiednim miejscu, w którym ma być wyświetlana mapa, wklejasz jej kod.
Byleś go tylko nie wlepił w środek skryptu php, bo się wysypie cały serwis.

dzięki, dokładnie to chodziło mi o to jak połączyć wstawione zdjęcie z mapą

usemap="#mapa" - dzięki temu wszystko działa bez problemuSławomir Winiecki edytował(a) ten post dnia 18.02.11 o godzinie 12:39

Temat: menu z obrazka

Wygenerowany kod to czysty html.
A w którym miejscu go wstawić, to już sam powinieneś określić.
Jeśli to ma być wklejone w notce, to podczas redagowania wpisu w edytorze wybierasz opcję podglądu źródła i tam wklejasz kod z mapą obrazu.

Jeśli chcesz ją wkleić w bocznym pasku (sidebar) wtedy edytujesz plik sidebar.php i w odpowiednim miejscu, w którym ma być wyświetlana mapa, wklejasz jej kod.
Byleś go tylko nie wlepił w środek skryptu php, bo się wysypie cały serwis.

dzięki, dokładnie to chodziło mi o to jak połączyć wstawione zdjęcie z mapą

usemap="#mapa" - dzięki temu wszystko działa bez problemuSławomir Winiecki edytował(a) ten post dnia 18.02.11 o godzinie 12:39

nie wiem czy wszystko dobrze robię, ale obojętnie czy ładuję plik z komputera czy z url to po zakończeniu mapowania i wstawieniu kodu na stronę moja mapa przesuwa się i nie wygląda to tak samo jak w edytorze. konkretnie chodzi o to, ze zaznaczone obszary, ktore powinny linkować przesuwają się same i najeżdzając nad wybrane słowo nie widzimy już linka, ktory przesunął się gdzieś obok. nie są to wielkie przesunięcia ale skutecznie uniemożliwiają prawidłową nawigację.
proszę o wskazówki.
Wojciech J.

Wojciech J. mistrz wwwujitsu

Temat: menu z obrazka

1. generator generuje kod mapy, ale obraz musisz sam zdefiniować.
Przykład:

<figure>
<img src="http://adres-obrazka" width="" height="" alt="alternatywny tekst" usemap="#wygenerowananazwamapy" id="mapa"/>
</figure>

Nazwa dla usemap="#nazwa" znajduje się w wygenerowanym kodzie.

2. Wrzuć tą mapę do kontenera, któremu z kolei zresetuj marginesy i przesunięcie.
Na zasadzie:


<style TYPE="text/css">
#mapcontainer {
margin:0;
padding:0;
}
#mapcontainer img {
border:none;
}
</style>

<div id="mapcontainer">
[tutaj kod html z mapą]
</div>



Nie gwarantuję że pomoże, bo to rozwiązanie dla czystego kodu, a pojęcia nie mam jak głęboko w drzewie elementów będzie siedzieć ta mapa oraz jakie style przejmie od rodziców.

Następna dyskusja:

[css][html] Menu windowso-p...




Wyślij zaproszenie do