Hi Sichfred...
langsam muss ich gestehen wird es mir etwas unangenehm, da ich anscheinend irgend etwas nicht wirklich verinnerlicht habe und es nicht wie gewünscht realisiert bekomme....
Vielleicht können wir daher einfach mal eine Fehleranalyse meines jetzt eingebauten Codes angehen...? Ich denke ich habe eventuell einige Fehler im Aufbau oder Deklaration falsch...
Also: begonnen logischerweise in dem ich das <div> meiner Textbox definiert habe im Head:
<style type="text/css">
#box {
display:block;
position:relative; top:10px; left:10px;
height:0px;
width:200px;
background-image:url("../assets/images/grey2.gif");
background-repeat:no-repeat;
background-position:top center;
overflow:hidden;
border:0px solid #999999;
padding-left:20px;
padding-right:20px;
padding-top:5px;
z-index:1;
}
</style>
Die ID dem Textfeld zugewiesen und danach noch die Links der Bilder mit einem Name Attribut versehen: Hier exemplarisch das erste Bild rechts oben auf der Seite.
<a href="./index.html"><img id="Bild3" height="40" width="44" src="file:///C:/Programme/NetObjects/NetObjects Fusion 10.0/User Sites/CSSTest/Assets/auge40.jpg" border="0" alt="auge40" title="auge40" name="foo"; onmouseover = "ein_ausblenden(this.name, 'in');"></a></div>
Hier ist also onMouseOver realisiert und dem Bild das Name Attribut "name="foo" übergeben. Alles weitere findet dann nun im Script statt:
<script type="text/javascript">
function ein_ausblenden(elemName, Direction) {
if(typeof blende != 'undefined') window.clearInterval(blende);
var Blendtext = new Object; /*Blindtext muss doch als "var" definiert werden, oder nicht?*/
var Blendtext.HTMLObjID = 'box';
var Blendtext.Start = 0;
var Blendtext.Ende = 240;
var Blendtext.foo = "<p>Beschreibung zu Link 1</p>";
var Blendtext.bar = "<p>Beschreibung zu Link 2"</p>";
var obj = document.getElementById(Blendtext.HTMLObjID);
var elem = document.getElementById(Blendtext.HTMLObjID).style;
if(Direction == 'in') {
obj.innerHTML = Blendext[elemName];
pixel = Blendtext.Start;
blende = window.setInterval("blende_ein()", 20);
}
else if(Direction == 'out') {
pixel = Blendtext.Ende;
blende = window.setInterval("blende_aus()", 20);
}
else {
return;
}
blende_ein = function() {
elem.height = pixel + 'px';
pixel = pixel + 4;
if ( pixel > Blendtext.Ende ) {
window.clearInterval(blende);
}
}
blende_aus = function() {
elem.height = pixel + 'px';
pixel = pixel - 4;
if ( pixel < Blendtext.Start ) {
window.clearInterval(blende);
}
}
}
</script>
--------------------- Hier endet mein Code, ab hier zietiere ich mit deinen Codezeilen aus deinem vorherigen Post ------------------
<img src="foo.gif" name="foo">
<img src="bar.gif" name="bar">
>
> Dynamisch hinzugefügt wird
>
> `onmouseover = "ein_ausblenden(this.name, 'in');"`{:.language-HTML}
Oder habe ich hier bereits grundsätzlich falsch verstanden, WO du Mouseover und Name="foo" implementierst? Ist (this.name) ein Automatismus, der direkt das Name-Attribut ausliest?
> Daher der Konfigurationsabschnitt im oberen Teil von »»testtextfeld.js. Dieser auf deinen Fall und mein Beispiel mit den »»zwei Bildern umgemünzt sähe dann wie folgt aus:
»»
Habe ich überhaupt eine Möglichkeit aus dem Quelltext deiner Testseite die TestTextfeld.js auszulesen oder einzusehen???
> ~~~javascript
Blendtext = new Object;
> // ID des zu blendenden HTML-Elementes
> Blendtext.HTMLObjID = 'box';
> // Startwert fürs Einblenden
> Blendtext.Start = 0;
> // Maximalwert und Startwert fürs Ausblenden
> Blendtext.Ende = 200;
> // Texte zu den einzelnen Grafiken
> Blendtext.foo = "<h2>Link 1</h2><p>Beschreibung zu Link 1";
> Blendtext.bar = "<h2>Link 2</h2><p>Beschreibung zu Link 2";
Dieser Code legt ein Objekt "Blendtext" an und speichert alle »»*statischen* Informationen. Das ist sinnvoll, wenn du den Code »»wiederverwenden willst, dann musst du Werte nur an einer Stelle »»ändern (z.B. die ID des Blendelementes) und nicht in die »»eigentlichen JS-Funktionen eingreifen.
Prinzip verstanden, an der Umsetzung hakt es aber wie gesagt. Als Variable definieren? über der Funktion platzieren, direkt nach Einleitung des Scripts?
function ein_ausblenden(elemName, Direction) {
Wird hier automatisch die var=elemName mit "this.name" aus dem Mouseover "versorgt"? Hätte dafür nicht elemName noch als var im Vorfeld definiert werden müssen?
if(typeof blende != 'undefined') window.clearInterval(blende);
var obj = document.getElementById(Blendtext.HTMLObjID);
var elem = document.getElementById(Blendtext.HTMLObjID).style;
if(Direction == 'in') {
obj.innerHTML = Blendtext[elemName];
Hier hänge ich daran, wie elemName wie oben bereits erwähnt mit "Inhalten" versorgt wird.
pixel = Blendtext.Start;
blende = window.setInterval("blende_ein()", 20);
}
else if(Direction == 'out') {
pixel = Blendtext.Ende;
blende = window.setInterval("blende_aus()", 20);
}
// restlicher Code
}
>
Das habe ich zumindest in Gänze verstanden... wenigstens etwas...
Wie gesagt, langsam ist es mir echt etwas unangenehm, da ich trotz querlesen in diversen Foren und Tutorials nicht hinter das Geheimniss komme, was ich denn gerade falsch mache... Und ich nicht nachvollziehen kann, ob es ein gravierender Fehler ist, oder einfach nur Fehler in der korrekten Schreibweise....
Vielen Dank für deine Geduld bis hierher... Ist sicher nicht selbstverständlich...!
Ich habe nun meine Testseite mit oben beschriebenen Code nochmals online gestellt... Resultat? Es tut sich leider absolut nix...:-(
<http://www.tuff-tuff.de/test/html/testtextfeld.html>
Danke und Gruss.... Mac