Drzewo genealogiczne na stronie internetowej


(Wiktoria Strzelec) #1

Witam! Jestem całkowitym laikiem w kwestii tworzenia stron internetowych, przyznam szczerze, że nie wiem nawet jak zabrać się za cssa, a muszę zrobić stronę internetową z drzewem genealogicznym bogów greckich. Rzecz jasna mogłabym stworzyć stronę internetową z wrzuconym obrazkiem z takim wykresem, lecz potrzebuję, aby po kliknięciu na nazwę boga można było wyświetlić o nim informację (właściwie nie jestem pewna nawet jak to zrobić, planowałam wrzucić tam hiperłącze do Wikipedii). 

Dla mnie brzmi to jak czarna magia i jest ogromnie skomplikowane - nie wiem, czy ogółem jest to spory informatyczny problem. Czy jest to trudne? Jakie jest polecenie do tworzenia takiej opcji? Gdzieś w otchłaniach internetu znalazłam komendę {{familytree/start}}, ale to chyba jest właśnie css, którego nie umiem obsługiwać. Jest sens się w ogóle za to zabierać?

 


(system) #2

Możesz to zrobić jako jeden obrazek z mapą odsyłaczy. Większość programów do twrzenia WWW potrafi to robić.

Oprócz tego potrafią to robić programy graficzne, np Gimp ma w filtrach tworzenie tego.

http://www.idg.pl/news/92948/odsylacze.linki.na.obrazku.gimp.pomoze.html


(Wiktoria Strzelec) #3

O jeny, dziękuję pięknie!  :smiley:


(Piesek64) #4

Teraz ja jeszcze dam:


Coś takiego może: http://jsfiddle.net/Py64/7hzyfndy/

lub: http://jsfiddle.net/Py64/z87swbr9/

– edit: dałem te same linki…ehh oczywiście JSFiddle musi wkurzać z swoim zoomowaniem.


(Wiktoria Strzelec) #5

Wiem, że wykażę się całkowitym idiotyzmem, ale nie mam pojęcia, jak tego używać…


(YoJoe) #6

Możesz wykorzystać dedykowaną aplikację online, o ile spełni twoje oczekiwania.

Demo do oglądnięcia: http://svn.webtrees.net/demo-stable/


(Drobok) #7

Jemu chodziło o to że twój element mapy odsyłaczy będzie miał jakiś schowany tekst, sam kod nie działa tak jak powinien (albo ktoś zapomniał zablokować zmiany), a w mapie odsyłaczy to się w ogóle nie przyda.

Korzystając z mapy odsyłaczy dodaj elementom tooltipy http://jqueryui.com/tooltip/ (tam jest przykład itd)