ugrás a tartalomhoz

Linkkattintásra képmozgatás

Tetsuo · 2004. Okt. 20. (Sze), 04.51
Először is Sziasztok! (Ez az első hozzászólásom.)

Másodszr van egy (ill sok kicsi) problémám a weboldalammal kapcsolatban:
Azt kéne megoldani (gondolom JScripttel) hogy egy linkre kattintva odébb menjen egy kis kép (egy másik felett), majd egy másik linkre kattintva megint odébb menjen.. s emellett a link színe változzon át (ezt megtudom oldani) s egy másik frémben változzon a tartalom (ezt is).
Annyit tudok hogy onClick parancs, de hogyan?
Nagyon megköszönném! :)
‹ timezone L-alakú frém csak layerekkel? ›
 ■
1

Részletesebben?

Poetro · 2004. Okt. 20. (Sze), 13.53
Már ha kattintasz a linkre, akkor arrébb kerül egy kép?
Miért nem szerveroldalon oldod meg. Mondjuk eltárolod, hogy hol vannak a képek (cookie, session), és klikkelésnél a margóját (margin)
--------
Poetro
2

mihez kene?

Jano · 2004. Okt. 20. (Sze), 17.58
Ha leirod mit szeretnel csinalni akkor konnyebb elkepzelni a problemat. Mert igy nem egeszen ertem mi az az "odebb megy egy masik kep felett."

Es miert van 2 link, hogy odebb menjen. Szoval inkabb azt ird le mihez kene ez.
3

konkrétan:

Tetsuo · 2004. Okt. 21. (Cs), 00.31
Szóval a weboldal függőlegesen fel van osztva 3 frémre, a középsőben jelennek meg a szövegek, képek stb..
A jobb oldalon van a menü mellette pedig egy tólópotméter. Namost (azt szeretném) ha a delikvens kiválaszt egy menüpontot, azaz ráklikkel egy linkre vagy a csúszka leendő helyére, akkor a középső frémben a tartalom megváltozzon és a megjelölt link felirata más színre váltson s ami a gondot okozza a csúszka a megfelelő pozícióba csússzon (nem kell folytonos mozgás, csak egy ugrás).
A csúszka egy jpeg kép, ami egy másik jpeg kép felett ugrana a 8 menüpontnak megfelelő állásba.
Tehát egy kattintásnak 3 hatása lenne, amit nem tudok megvalósítani egyenlőre..
A csúszka leendő helyére való kattintást gondolom könnyen meg lehet oldani usemap segítségével, de a szövegre az már nem hat, (ráadásul az egy külön kis frémben van, nyolc frém van összesen de ez most nem érdekes.)

A klins vs szerveroldalhoz és a cookiek kezeléséhez nem igazán értek, egy átlagos free oldalra szeretném felnyomatni az oldalt ha kész, addig sorban tanulgatom a webszerkesztés rejtelmeit, adatbáziskezeléssel csak jóval később akarok foglakozni.
4

csuszka

Jano · 2004. Okt. 21. (Cs), 00.53
Csinald CSS-bol:


<ul>
 <li><a href="">menu1</a></li>
 <li><a href="">menu2</a></li>
 <li class="aktiv"><a href="">menu3 ez epp kijelol</a></li>
...
</ul>



ul {
 background:url(csuszka_sin.jpg) left top no-repeat;
 padding:0;
 margin:0;

 padding-left:30px;
 list-style:none;
}

li {
 padding-left:30px;
 margin-left:-30px;
}

li.aktiv {
 background:url(csuszka_mutato.jpg) left center no-repeat;
}
Az UL-nek adod hattererul a csuszka sinjet. Az UL egy teglaalaku terulet mint egy DIV. Ennek a baloldalara kerul a sin. A lista elemeket 30px-ellel eltolod befele a paddinggal. 30px ha ilyen szeles a csuszka.

A lista elemeket a negativ margoval visszahuzod a sin fole. Itt a szoveget ugyanugy befele tolod a hatterkep mogul.

Az aktiv osztalyu li hattere lesz a csuszka mutatoja es az pont ott fog allni ahol kell.

Ezekutan amikor rakattintasz akkor vagy javascripttel atallitod a class nevet, vagy szepen ujra toltod az adott framet.

Egyebkent miert hasznalsz frameket? Nagyon sok hatranyuk van.
5

online pelda

Jano · 2004. Okt. 21. (Cs), 09.51
Hello megcsinaltam online a peldat:
http://www.hszk.bme.hu/~hj130/css/list_menu/csuszka/
6

cool

Bártházi András · 2004. Okt. 21. (Cs), 11.22
Tök jó lett. :)

-boogie-
8

usability

Jano · 2004. Okt. 21. (Cs), 14.35
Mondjuk a dologhoz hozzatennem, hogy hasznalhatoasi szempontbol nem egy jo megoldas, legalabbis ezzel a designnal biztos nem. Ugyanis ranezve azt hiszed, hogy a csuszkat tologatva is allithatod a menut.
Megprobalod egerrel tologatni es nem fog menni.

De egy olyan dizajn ahol jol lathatoan csak "odacsuszott jelezni a butyok, nyil" az jo lehet.
7

csúszkáljon is:-))

Anonymous · 2004. Okt. 21. (Cs), 12.22
tényleg nagyon király:-)
nem tudtam ellenállni, s
+csináltam, h. csúszkáljon:-)))
$menu[] = "menu1";
$menu[] = "menu2";
$menu[] = "menu3";

$page = (!empty($page)?$page:$menu[0]);

print "<div id=\"menu\">\n";
print"<ul>\n";
foreach ($menu as $m):
$aktiv = ($page===$m?" class=\"aktiv\"":"");
print "<li$aktiv><a href=\"$PHP_SELF?page=$m\">$m</a></li>\n";
endforeach;
print "</ul>\n";
print "</div>\n";

megnézhető:
http://levante.uw.hu/weblabor/tmp.php

xxx
9

Sok köszönet!

Tetsuo · 2004. Okt. 22. (P), 01.23
Wow! THX evribádi!
Hát jóideig tanulmányozni fogom a kódokat (én teljesen másfelé mentem) :)