mouseover im Content funktioniert nicht...

[falcon78]

Hallo Leute und zuerst mal an alle hier ein gutes, gesundes 2013 !!

Habe ein Problem mit unserer Über uns Seite:
http://milestone-ag.ch/Team:_:13.html

Bei einem Mouseover sollte eigentlich das entsprechende Bild farbig sein, da geschieht aber nichts, sehe im Code keinen Fehler, ist wahrscheinlich aber die Neujahrsblindheit oder so

Hier der Quellcode welchen ich aus dem Contentmanager im Backend habe:

Code: CSS  [Auswählen]

<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
<table width="705" align="center" cellspacing="0" cellpadding="0" border="0" style="">
    <tbody>
        <tr>
            <td style="text-align: center;"><br />
            &nbsp;</td>
            <td style="text-align: center;"><br />
            <a onmouseover="MM_swapImage('walti','','/images/walti(1).jpg',1)" onmouseout="MM_swapImgRestore()" href="mailto:walter.cavegn@milestone-ag.ch?subject=Anfrage%20via%20Homepage"><img width="130" vspace="1" hspace="1" height="163" border="1" alt="" id="walti" name="walti" src="/images/walti(2).jpg" /></a> <br />
            <strong>Walter Cavegn</strong><br />
            <span style="font-size: smaller;"><em>Inhaber<br />
            </em></span><span style="font-size: smaller;"><a href="mailto:walter.cavegn@milestone-ag.ch?subject=Anfrage%20via%20Homepage">walter.cavegn@milestone-ag.ch</a><br />
            <span style="color: rgb(255, 0, 0);">Telefon direkt: +41 61 415 30 43</span><br />
            <a target="_blank" href="https://www.xing.com/profile/Walter_Cavegn"><img width="41" height="15" src="/images/xing.png" alt="" /></a><br />
            </span></td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;"><br />
            <a href="mailto:michael.schneider@milestone-ag.ch?subject=Anfrage%20via%20Homepage" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('michi','','/images/michi(1).jpg',1)"><img width="130" vspace="1" hspace="1" height="163" border="1" alt="" id="michi" name="michi" src="/images/michi(2).jpg" /></a><br />
            <strong>Michael Schneider</strong><br />
            <em><span style="font-size: smaller;">Kundenbetreuung</span></em><br />
            <span style="font-size: smaller;"><a href="mailto:michael.schneider@milestone-ag.ch?subject=Anfrage%20via%20Homepage">michael.schneider@milestone-ag.ch</a><br />
            </span><span style="color: rgb(255, 0, 0);"><span style="font-size: smaller;">Telefon direkt: +41 61 415 30 40</span></span><span style="font-size: smaller;"><br />
            <a target="_blank" href="https://www.xing.com/profile/Michael_Schneider339"><img width="41" height="15" src="/images/xing.png" alt="" /></a><br />
            </span></td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">
            <p><br />
            <a onmouseover="MM_swapImage('claude','','/images/claude(1).jpg',1)" onmouseout="MM_swapImgRestore()" href="mailto:claude.vital@milestone-ag.ch?subject=Anfrage%20via%20Homepage"><img width="130" vspace="1" hspace="1" height="163" border="1" alt="" id="claude" name="claude" src="/images/claude(2).jpg" /></a><br />
            <strong>Claude Vital</strong><br />
            <em><span style="font-size: smaller;">Kundenbetreuung</span></em><br />
            <a href="mailto:claude.vital@milestone-ag.ch?subject=Anfrage%20via%20Homepage"><span style="font-size: smaller;">claude.vital@milestone-ag.ch</span></a><br />
            <span style="color: rgb(255, 0, 0);"><span style="font-size: smaller;">Telefon direkt: +41 61 415 30 45</span></span><br />
            <a target="_blank" href="https://www.xing.com/profile/Claude_Vital"><span style="font-size: smaller;"><img width="41" height="15" src="/images/xing.png" alt="" /></span></a></p>
            </td>
        </tr>
        <tr>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
        </tr>
        <tr>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
        </tr>
        <tr>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
        </tr>
        <tr>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;"><a onmouseover="MM_swapImage('irene','','/images/irene(1).jpg',1)" onmouseout="MM_swapImgRestore()" href="mailto:info@milestone-ag.ch?subject=Anfrage%20via%20Homepage"><img width="130" vspace="1" hspace="1" height="163" border="1" alt="" id="irene" name="irene" src="/images/irene(2).jpg" /></a><br />
            <strong>Irene Frei</strong><span style="font-size: smaller;"><em><br />
            Kundenbetreuung<br />
            </em></span><span style="font-size: smaller;"><a href="mailto:info@milestone-ag.ch?subject=Anfrage%20via%20Homepage">info@milestone-ag.ch</a><br />
            </span><span style="color: rgb(255, 0, 0);"><span style="font-size: smaller;">Telefon: +41 61 413 11 33</span></span><span style="font-size: smaller;"><br />
            </span></td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;"><a onmouseover="MM_swapImage('nina','','/images/nina.jpg',1)" onmouseout="MM_swapImgRestore()" href="mailto:nina.fiessler@milestone-ag.ch?subject=Anfrage%20via%20Homepage"><img width="130" vspace="1" hspace="1" height="163" border="1" alt="" id="nina" name="nina" src="/images/nina_sw.jpg" /></a><br />
            <strong>Nina Fiessler</strong><span style="font-size: smaller;"><em><br />
            Produktion<br />
            </em></span><span style="font-size: smaller;"><a href="mailto:nina.fiessler@milestone-ag.ch?subject=Anfrage%20via%20Homepage">nina.fiessler@milestone-ag.ch</a><br />
            </span><span style="color: rgb(255, 0, 0);"><span style="font-size: smaller;">Telefon direkt: +41 61 415 30 49</span></span><span style="font-size: smaller;"><br />
            </span></td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;"><a onmouseover="MM_swapImage('simi','','/images/simi(1).jpg',1)" onmouseout="MM_swapImgRestore()" href="mailto:simone.jaeggi@milestone-ag.ch?subject=Anfrage%20via%20Homepage"><img width="130" vspace="1" hspace="1" height="163" border="1" alt="" id="simi" name="simi" src="/images/simi(2).jpg" /></a><br />
            <strong>Simone Jaeggi</strong><br />
            <em><span style="font-size: smaller;">Buchhaltung<br />
            </span></em><span style="font-size: smaller;"><a href="mailto:simone.jaeggi@milestone-ag.ch?subject=Anfrage%20via%20Homepage">simone.jaeggi@milestone-ag.ch</a><br />
            </span><span style="color: rgb(255, 0, 0);"><span style="font-size: smaller;">Telefon direkt: +41 61 415 30 42</span></span><span style="font-size: smaller;"><br />
            </span></td>
        </tr>
        <tr>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
            <td style="text-align: center;">&nbsp;</td>
        </tr>
    </tbody>
</table>
<p style="text-align: left; margin-left: 40px;">Ihr Partner f&uuml;r bedruckbare Werbartikel, Werbegeschenke und Promotionsartikel<br />
<br />
Wir beraten Sie gerne zu unserem Sortiment mit &uuml;ber 30'000 bedruckbaren Werbeartikel, Werbegeschenke, Kundengeschenke, Weihnachtsgeschenke, Mitarbeitergeschenke und Promotionsartikel. Nahezu alle unsere<br />
Artikel k&ouml;nnen entweder mit Siebdruck, Tampondruck, Textildruck, Transferdruck oder Lasergravur veredelt werden.</p>

Kann sich das mal kurz einer anschauen?
Wenn ich die Vorschau über den Content Manager im Backend des Shops anschaue, dann funktioniert das Script, aber im Frontend nicht, woran kann das liegen?

Vielen dank schon mal für Eure Hilfe!

Falcon78


Linkback: https://www.modified-shop.org/forum/index.php?topic=23948.0

[techniker2012]

Hallo

So wie es aussieht wird bei dir nur ein Bild geladen.
Wäre es nicht etwas einfacher so:

Code: CSS  [Auswählen]

<style type="text/css">
img.einbild { background-image: url(normal.gif);width:399px;height:70px; }
img.einbild:hover { background-image: url(aktiv.gif);width:399px;height:70px; }
</style>

werner

[falcon78]

Hallo Werner

Ich danke Dir für Deine Antwort, aber leider verstehe ich nicht ganz...sorry bin noch in der Lernphase
Ich habe das aus Dreamweaver kopiert...

Danke nochmals.

Falcon78

[techniker2012]

Hallo,

ich bin jetzt auch nicht der große css Guru 

mach es mit CSS
Schau mal hier http://brauchbar.de/artikel/css/der-mouseover-effekt-mit-css
da wird es eigentlich ganz gut beschrieben

werner

[noRiddle (revilonetz)]

...oder gleich mit jQuery, das ist doch sowieso schon geladen...

Gruß,
noRiddle

[falcon78]

und wie setze ich das mit jquery um? habe das nämlich nun im content manager mit der css variante versucht einzusetzen aber die CSS definition

Code: CSS  [Auswählen]

<style type="text/css">
img.walti { background-image: url(http://milestone-ag.ch/images/walti(2).jpg);width:130px;height:163px; }
img.walti:hover { background-image: url(http://milestone-ag.ch/images/walti(1).jpg);width:130px;height:163px; }
</style>
 

müsste doch in den header und das geht im content manager nicht und ich glaube daran liegt es nun dass mir diese hover geschichte gar nicht ausgegeben wird sondern nur das hier aus dem Body:

Code: CSS  [Auswählen]

<a href="mailto:walter.cavegn@milestone-ag.ch?subject=Anfrage%20via%20Homepage"> <img width="1" vspace="1" hspace="1" height="1" border="1" src="http://milestone-ag.ch/images/blind.gif" class="walti" alt="Walter Cavegn" /> </a>
 

hmmmm 

Gruss
Falcon78

[noRiddle (revilonetz)]

Das CSS kannst/solltest du in das stylesheet im Template auslagern.
Was sind denn das für image-Bezeichnungen ?
walti(1).jpg, geht das ?, bin mir da jetzt nicht sicher, ob der Dateiname Klammern beinhalten darf.

Wenn du's direkt über den Content-Manager mit jQuery machen willst:
Nicht getestet !!

Code: Javascript  [Auswählen]

<script type="text/javascript">
/* <![CDATA[ */
$(document).ready(function(){
    var $this = $(this);
    var $walti = $('.walti');
    $walti.hover(
        function(){
            $this.css('background-image', 'url(PFAD_ZUM_BILD/walti(1).jpg)');
        },
        function() {
            $this.css('background-image', 'url(PFAD_ZUM_BILD/walti(2).jpg)');
        }
    );
});
/* ]]> */
</script>

Gruß,
noRiddle

[noRiddle (revilonetz)]

Kannst auch eine Klasse per jQuery vergeben und diese Klasse im stylesheet definieren,
was sicherlich besser ist.
Z.B.:

Code: Javascript  [Auswählen]

function(){
    $(this).addClass('SwitchImg');
},
function(){
    $(this).removeClass('SwitchImg');
}

Gruß,
noRiddle

[h-h-h]

Code: XML  [Auswählen]

<img
src="/images/PFAD_ZUM_BILD/walti_1.jpg"
width="130"
height="163"
border="0"
onmouseover="omcache=this.src;this.src='/images/PFAD_ZUM_BILD/walti_2.jpg'"
onmouseout="this.src=omcache;"
alt="walti halt"
title="Inhaber"
id="walti"
/>

http://jsfiddle.net/cTxev/

 

[falcon78]

VIELEN DANK für Eure Hilfe!
 

Die Lösung von h-h-h war schlussendlich für mich die am einfachsten umzusetzende!
http://milestone-ag.ch/Team:_:13.html

Lieben Gruss und gute Nacht.

Falcon78

[noRiddle (revilonetz)]

Okay then, h-h-h fo president.

[techniker2012]

Da freuen sich aber deine Mitarbeiter das sie endlich Farbe ins Gesicht bekommen 

werner