PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : 2 Fragen: Bildwechsel und 2Link-Frame



nul
11-03-2005, 16:38
Ich haette da mal schnell zwei fragen:
1. Ich habe ein Bild als Link, wenn ich nun diesen Klicke soll natuerlich der Link geladen werden (in einem anderen Frame) und im selben Frame soll noch zusaetzlich ein anderes Bild geaendert werden.
Wie krieg ich das hin, dass sich auch das andere Bild aendert?

2. Wieder ein Bild als Link, und wenn ich drauf klicke sollen zwei andere Frames verschiedene Seiten laden, ist das moeglich?

Bsp:


-------------------------------------------
| |
| |
--------------------------------------------
| | |
| | |
| | |
| | |
| | |
|.........|...............................|
Der Linkknopf befindet sich oben, das Bild das veraendert werden soll ebenfalls, und zwar ein wenig daneben, die zwei unteren Frames sollen dann geladen werden, wenn auf den Knopf geklickt wird.

mfg
nul

BlueJay
11-03-2005, 17:34
onclick ruft schlicht und ergreifend die Javascript-function auf, die du dort angibst.
Diese Javascript-function muss nun eben alles erledigen: Bildtausch, Seite in bestimmten Frame laden, von 0 bis 1000 zählen oder was auch immer.

so long,
BlueJay

Pingu
11-03-2005, 22:15
siehe Manual z.B. bei SelfHTML: http://de.selfhtml.org/javascript/beispiele/index.htm

nul
12-03-2005, 16:50
Vielen Dank schon mal fuer euere HIlfe, auf die Frage mit den 2 Frames hab ich ja eine Loesung gefunden, aber mit dem Bildwechsel komm ich nicht ganz klar.
Ausschaun tut das ca. so:

----------------------------------------------
| Bild | |
| | Link1 Link2 Link3 Link4 Link5 |
|............................................|
Zu beginn soll ein STandartbild angezeigt werden. Wenn ich nun auf einen der Links cklicke soll das Bild sich aendern, je nach dem welchen Link angecklickt wird.

Kann mir vielleicht da auch noch jemand Helfen?

mfg nul

Pingu
12-03-2005, 18:09
RTFM: auch dafür gibt es ein Beispiel.

nul
13-03-2005, 11:55
Ok, ok, ich habs versucht; und zwar so:

function Display()
{
var Bild = new Array(5);
Bild[0] = new Image(); Bild[0].src="include/common/top/pics/logo.gif";
Bild[1] = new Image(); Bild[1].src="include/common/top/pics/kontakt.jpg";
Bild[2] = new Image(); Bild[2].src="include/common/top/pics/forum.jpg";
Bild[3] = new Image(); Bild[3].src="include/common/top/pics/bilder.jpg";
Bild[4] = new Image(); Bild[4].src="include/common/top/pics/ansuchen.jpg";

document.write('<img src="'+ Bild[0] +'">');
}
Wenn ich jetzt aber versuch das aufzurufen:

<script>Display();</script>
passiert nichts! :(

nul
13-03-2005, 12:33
OK, bin jetzt ein Stueck weiter:

<script language="javascript">
<!--
var called=false;
function Display($var)
{
called=true;
var home="include/common/top/pics/home.gif";
var kontakt="include/common/top/pics/kontakt.gif";
var forum="include/common/top/pics/forum.gif";
var bilder="include/common/top/pics/bilder.gif";
var ansuchen="include/common/top/pics/ansuchen.gif";

if ( $var == "home" ) {
document.write("<img src=" + home + ">");
} else if ( $var == "kontakt" ) {
document.write("<img src=" + kontakt + ">");
} else if ( $var == "forum" ) {
document.write("<img src=" + forum + ">");
} else if ( $var == "bilder" ) {
document.write("<img src=" + bilder + ">");
} else if ( $var == "ansuchen" ) {
document.write("<img src=" + ansuchen + ">");
} else {
document.write("<img src=" + home + ">");
}
}
//-->
</script>
Was mir aber noch probleme macht ist das anzeigen. Und Zwar - wie bekomme ich den Funktionsaufruf hin, dass er auch auf der entsprechenden Position das Bild aendert?

Pingu
13-03-2005, 13:21
Was mir aber noch probleme macht ist das anzeigen. Und Zwar - wie bekomme ich den Funktionsaufruf hin, dass er auch auf der entsprechenden Position das Bild aendert?
Ich weiß nicht wo das Problem? Arbeite doch ersteinmal die Beispiele genau durch und dann weißt Du auch wie es geht: http://de.selfhtml.org/javascript/beispiele/buttons.htm

BlueJay
15-03-2005, 07:49
Voraussetzung:
Du generierst im body-Teil ein Bild, was du hinterher gezielt ansprechen kannst, mit id für modernere Browser, mit name für etwas ältere Schätzchen:

<img src="wattweissich.png" name="my_bild" id="my_bild" alt="">

2. Du hast deine in Javascript vorgeladenen Bilder:


ima=new Array();
for (i=0; i<anz_bilder_auf_platte; i++) ima[i]=new Image();
ima[0].src="bild_a.png";
ima[1].src="Landschaft.png";
ima[2].src="Hund.png";
...


3. Du hast deine Funktion, die du mit onclick aufrufst:


function mach_hin(Bildnr)
{ mach_dies();
mach_das();
mach_sonst_noch_was();
....
// 4. Du schiebst eins der vorgeladenen Bilder dem HTML-Image objekt unter:
document.images['my_bild'].src=ima[Bildnr].src;
}


That's all!
BlueJay

Matflasch
06-04-2005, 17:40
Um JS zu vermeiden, kannst du CSS benutzen...



// CSS
.nav_links a:link, .nav_links a:visited, .nav_links a:active {
background: url(img/menu/nav_links.gif);
width: 150px;
height: 22px;
display: block;
background-position: center center;
}
.nav_links a:hover {
background: url(img/menu/nav_links_hi.gif);
width: 150px;
height: 22px;
background-position: center center;
}

// HTML
<div class="nav_links"><a href="#">&nbsp;</a></div>


Du kannst es halt anpassen, ob das Bild nur beim Hover oder bei Aktiv gewechselt werden soll, oder beides oder noch mehr ;)

Mfg, Matflasch