Mousovereffekt funzt nicht!

Gehe zu Seite:

Geschlossen

Mi. 28.10.2009 13:22 Uhr #1

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

Hallo Zusammen,

kurze Frage ich möchte einen Mouseovereffekt in eine Seite integrieren, leider stelle ich mich anscheinen zu dumm an!

es soll wie dieser Effekt funktionieren, bitte über die einzelnen Siluetten mit der Mouse gehen!

[url]www.Tapier-Tattoo.de[/url]

Leider bekomme ich das nicht hin!

Mein angepasster Code:
Zitat

<div align="left"><a href="http://quipumedia.de/preview/tattoo_bilder/tapier/norris/index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image09','','externer Link"><img src="http://www.tapier.kilu.de/include/images/gallery/norris_over.gif" alt="Norris" width="136" border="0" height="200"></a></div>

bitte diesen Link folgen zur TESTHOMPAGE

Vielen Dank

Chewbacca

verwendete ilchClan Version: 1.1

betroffene Homepage: externer Link
0 Mitglieder finden den Beitrag gut.
- zitieren
Mi. 28.10.2009 14:51 Uhr #2

Mairu Coder

Registriert seit
16.06.2006

Beiträge
15.334

Beitragswertungen

-> 'Image09','hier der link zum mouseover','hier der link zum bild'

Du hast da was frei gelassen in deinem Code, es muss so wie oben sein, natürlich dann mit Links zu den Bildern.

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
0 Mitglieder finden den Beitrag gut.
- zitieren
Mi. 28.10.2009 15:58 Uhr #3

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

Hallo Mairu,

Zitat
<td width="136" height="200"><a href="http://quipumedia.de/preview/tattoo_bilder/tapier/norris/index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image09','','externer Link"><img src="http://www.tapier.kilu.de/include/images/gallery/norris_over.gif" alt="Norris" name="Image09" width="136" height="200" border="0" id="Image09" /></a></td>

so sieht es momentan bei mir aus! Leider wird so nicht das graue bild zuerst gezeigt und per mousover dann in vollem Glanz!;)

Grüße

Chewbacca
0 Mitglieder finden den Beitrag gut.
- zitieren

Mi. 28.10.2009 19:11 Uhr #4

Mairu Coder

Also nochmal, was zuerst angezeigt wird, dass ist bei img src zu hinterlegen, bei dem MM_swapImage( müssen beide Bilder angegeben werden, also ist eins doppelt, in welche Reihenfolge weiß ich nicht genau, aber das kannst du doch leicht testen.

Also entweder

<td width="136" height="200"><a href="http://quipumedia.de/preview/tattoo_bilder/tapier/norris/index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image09','http://www.tapier.kilu.de/include/images/gallery/norris_over.gif','www.tapier.kilu.de/include/images/gallery/norris_normal.gif',1)"><img src="www.tapier.kilu.de/include/images/gallery/norris_normal.gif" alt="Norris" name="Image09" width="136" height="200" border="0" id="Image09" /></a></td>

oder so

<td width="136" height="200"><a href="http://quipumedia.de/preview/tattoo_bilder/tapier/norris/index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image09','www.tapier.kilu.de/include/images/gallery/norris_normal.gif','http://www.tapier.kilu.de/include/images/gallery/norris_over.gif',1)"><img src="www.tapier.kilu.de/include/images/gallery/norris_normal.gif" alt="Norris" name="Image09" width="136" height="200" border="0" id="Image09" /></a></td>

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Do. 29.10.2009 10:12 Uhr #5

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

Hallo Mairu,

tut mir leid aber er macht nicht den Mouseover! Ich habe jetzt schon alle Varianten durch!
Es bleibt immer das Bild bestehen, welches unter img src= eingetragen ist!

Was bedeutet die 1 in der MM_swapImage Klammer am Ende?

Was ist eigentlich damit gemeint?

name="Image09"
id=Image09"

Ich habe im Netz auch ein Mouseovergenerator gefunden, selbst der bekommt es nicht hin, obwohl ich dort alle angaben machen kann 1. erstes Bild, 2. zweites Bild und 3. zu welcher Adresse!

:'(

Chewbacca
0 Mitglieder finden den Beitrag gut.
- zitieren
Do. 29.10.2009 11:13 Uhr #6

Rock@wulf Hall Of Fame

Registriert seit
03.06.2004

Beiträge
3.282

Beitragswertungen

OMFG

Leute fügt mal die Funktion ein ein aufruf eines JS scriptes sollte es auch das script geben ^^

Meine Postings repräsentieren meine Meinung wenn nicht anders gekennzeichnet.
MFG Rock@wulf
0 Mitglieder finden den Beitrag gut.
- zitieren
Do. 29.10.2009 11:27 Uhr #7

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

da ich leider mir alles selbst aneigne, fehlt mir natürlich auch eine Menge wissen, kommt halt alles peu à peu!

Zitat
Leute fügt mal die Funktion ein ein aufruf eines JS scriptes sollte es auch das script geben ^^

Was meinst du damit?

Grüße

Chewbacca
0 Mitglieder finden den Beitrag gut.
- zitieren

Do. 29.10.2009 13:03 Uhr #8

Mairu Coder

Naja du hast dir wahrscheinlich was zusammengesucht und hast es dann nichtmal, davon war ich natürlich nicht ausgegangen, dann können wir es eh gleich anders machen, ich hab ne viel hübschere Variante geschrieben für Mouseover die auf jquery basiert.

<script type="text/javascript" src="scripts/jquery/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        //Mouseover für mosrc Attribute bei Bildern
        var mosrcFn = function (){
            var el = $(this);
            var src = el.attr('src');
            el.attr('src', el.attr('mosrc'));
            el.attr('mosrc', src);
        };
        $("img[mosrc]").hover(mosrcFn, mosrcFn);
    });
    $(window).load(function() {
        //Bilder von Mouseovern vorladen
        $("img[mosrc]").each(function() {
            var img = new Image();
            img.src = $(this).attr('mosrc');
        });
    });
</script>

Das müsste in den Kopf deines HTML ok, du kannst es auch einfach an den Anfang von deiner Content Datei setzen, aber im Grund sollte es in die index.htm des Designs oder halt mit $design->addheader('...'); eingefügt werden.

Auf jeden Fall kannst du dann einfach <img src="hier der pfad zum bild" mosrc="hier der pfad zum mouseover" alt="bild" /> verwenden für Mouseover, das sieht dann viel aufgeräumter aus, finde ich.

Du musst dabei natürlich ggf. den Pfad und den Namen der jquery_xxx.js anpassen, wie du es eben bei dir einrichtest.

Zuletzt modifiziert von Mairu am 29.10.2009 - 13:05:49

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite

0 Mitglieder finden den Beitrag gut.

zitieren

Fr. 30.10.2009 16:23 Uhr #9

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

Danke

Ich probier es!
0 Mitglieder finden den Beitrag gut.
- zitieren

Mo. 02.11.2009 09:17 Uhr #10

Chewbacca Mitglied

Guten Morgen Mairu,

so ich habe es jetzt mal probiert, leider bekomme ich es nicht hin!

den Code habe ich direkt in den Bereich eigene Seite eingegeben:

<script type="text/javascript" src="include/includes/xajax_js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        //Mouseover für mosrc Attribute bei Bildern
        var mosrcFn = function (){
            var el = $(this);
            var src = el.attr('src');
            el.attr('src', el.attr('mosrc'));
            el.attr('mosrc', src);
        };
        $("img[mosrc]").hover(mosrcFn, mosrcFn);
    });
    $(window).load(function() {
        //Bilder von Mouseovern vorladen
        $("img[mosrc]").each(function() {
            var img = new Image();
            img.src = $(this).attr('mosrc');
        });
    });
</script>
<img src="http://www.tapier.kilu.de/include/images/gallery/norris_normal.gif" mosrc="http://www.tapier.kilu.de/include/images/gallery/norris_over.gif" alt="bild" />

ich bekomme zwar das normale Bild angezeigt, jedoch nicht das Mousover!

Ich habe es auch mit der Index.htm probiert.
Ich habe den code direkt nach dem <head> eingesetzt.

...
<head>
<script type="text/javascript" src="include/includes/xajax_js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        //Mouseover für mosrc Attribute bei Bildern
        var mosrcFn = function (){
            var el = $(this);
            var src = el.attr('src');
            el.attr('src', el.attr('mosrc'));
            el.attr('mosrc', src);
        };
        $("img[mosrc]").hover(mosrcFn, mosrcFn);
    });
    $(window).load(function() {
        //Bilder von Mouseovern vorladen
        $("img[mosrc]").each(function() {
            var img = new Image();
            img.src = $(this).attr('mosrc');
        });
    });
</script>

...und dann den Code in eigene Seite erstellen angegeben:

1	`<img src="http://www.tapier.kilu.de/include/images/gallery/norris_normal.gif" mosrc="http://www.tapier.kilu.de/include/images/gallery/norris_over.gif" alt="bild" />`

Ich bitte nochmal um einen Denkanstoß

Danke

Chewbacca

Zuletzt modifiziert von Chewbacca am 02.11.2009 - 09:19:04

0 Mitglieder finden den Beitrag gut.

zitieren

Mo. 02.11.2009 09:56 Uhr #11

Mairu Coder

Registriert seit
16.06.2006

Beiträge
15.334

Beitragswertungen

Ich denke das Problem ist, dass du es 2 mal eingefügt hast, und dadurch alles beim alten bleibt wenn du mit der Maus über ein Bild fährst, also du darfst den Code, den ich dir gegeben haben nur einmal einfügen, also dort im Head bereich des index.htm ist ok, nimmst dort raus, wo du das Bild hast.

Zuletzt modifiziert von Mairu am 02.11.2009 - 12:10:39

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
0 Mitglieder finden den Beitrag gut.
- zitieren

Mo. 02.11.2009 10:57 Uhr #12

Chewbacca Mitglied

Guten Morgen Mairu,

du hattest mal wieder recht gehabt! Dadurc, dass es eine Dopplung war ging es nicht! Ich habe dies jetzt geändert!

so....jetzt wollte ich das ganze natürlich mit einem Link versehen, dachte mir, dass es so funktioniert:

1	`<url=http://www.tapier.kilu.de/index.php?gallery-1><img src="http://www.tapier.kilu.de/include/images/gallery/norris_normal.gif" mosrc="http://www.tapier.kilu.de/include/images/gallery/norris_over.gif" alt="bild" /></url>`

wie zu erwarten war - Pustekuchen! Wo ist denn da mein Denkfehler?

Grüße

Chewbacca

0 Mitglieder finden den Beitrag gut.

zitieren

Mo. 02.11.2009 11:13 Uhr #13

Chapter Hall Of Fame

Registriert seit
21.10.2007

Beiträge
5.951

Beitragswertungen

#off topic

hey. also das design der seite würde ich ändern. das hat mit tattoo irgendwie nix zu tun. die idee vom aufbau her find ich gut, aber das design nicht. bau vielleicht ein paar motive ein oder so

wenn du hilfe brauchst, meld dich per pm

Spamming, sinnlose Beiträge, Pushing, Doppelposting und Werbung sind verboten
externer Link
0 Mitglieder finden den Beitrag gut.
- zitieren
Mo. 02.11.2009 12:10 Uhr #14

Mairu Coder

Registriert seit
16.06.2006

Beiträge
15.334

Beitragswertungen

Ein Link wird so angegeben
?
1
<a href="http://adresse.de">Inhalt/Bild</a>

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
0 Mitglieder finden den Beitrag gut.
- zitieren
Mo. 02.11.2009 12:27 Uhr #15

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

Mairu for President!

vielen Dank mal wieder! man, man, man das eine Problem gelöst kommt das nächste! so jetzt habe ich mit deiner Hilfe alles hinbekommen!

Jetzt ist aber bei dem Bild ein Rahmen! Warum bzw. wie bekomme ich den weg und wie bekomme ich die Farben weg, wo Links hinterlegt sind?

EDIT: den Rahmen habe ich hinbekommen, leider die Farbe der Links noch nicht!

Danke nochmal

Chewbacca

Zuletzt modifiziert von Chewbacca am 02.11.2009 - 12:43:47
0 Mitglieder finden den Beitrag gut.
- zitieren
Mo. 02.11.2009 15:09 Uhr #16

Mairu Coder

Registriert seit
16.06.2006

Beiträge
15.334

Beitragswertungen

Wenn du die Farbe aller Links auf deiner Seite ändern willst, dann in der style.css deines Designs, folgendes einfügen (oder ggf. vorhandenes ändern)

?
1
2
3
a {
color: #FARBCODE;
}

Und auch immer mal ein Blick auf die FAQ werfen. | Mairus Ilchseite
0 Mitglieder finden den Beitrag gut.
- zitieren
Mo. 02.11.2009 15:42 Uhr #17

Chewbacca Mitglied

Registriert seit
07.02.2009

Beiträge
137

Beitragswertungen

Hallo Mairu,

ich denke das war es dann erstmal! Vielen Dank!

Grüße

Chewbacca
0 Mitglieder finden den Beitrag gut.
- zitieren

Beitrag zur Merkliste hinzufügen

ilch Forum » Ilch Clan 1.1 » Fehlersuche und Probleme » Mousovereffekt funzt nicht!