Lexi Help
Partner
www.forumieren.com

[Phpbb 2] Problem mit Mouse Hover Effekt

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten

Erledigt [Phpbb 2] Problem mit Mouse Hover Effekt

Beitrag von DarkLuna89 am Mi 18 Jul 2012 - 14:01

Ich habe in einem Code den Mouse Hover Effekt das wenn man über den Namen geht das Standardbild durch das Bild des Teammitgliedes ersetzt wird über dessen Name man geht. Bilder werden auch angezeigt nur ist das Problem das nur die ersten beiden richtig angezeigt werden und die anderen nicht. Die anderen werden trotz anderer Bilder durch die Bilder der ersten beiden ersetzt.

Mir wurde gesagt ich soll mal bei den variablen nachschauen und die verändern. Nur ist das Problem das ich nicht weiß welche ich da verändern muss damit alle Bilder richtig angezeigt werden.

Hier ist der Code den ich benutzte.
Code:
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"><tbody><tr><td class="row1" rowspan="3" align="center" valign="middle"><div class="gensmall"><script type="text/javascript">
<!--

  image0 = new Image;
  image0.src = "http://img528.imageshack.us/img528/7600/teamtitelbild2.png";
 
  image1 = new Image;
  image1.src = "http://img502.imageshack.us/img502/4229/teammelinda2.png";

  image3 = new Image;
  image3.src = "http://img521.imageshack.us/img521/3792/teamphillis2.png";

  image4 = new Image;
  image4.src = "http://img833.imageshack.us/img833/5677/teampiper1.png";

  image5 = new Image;
  image5.src = "http://img140.imageshack.us/img140/2622/teamhailey2.png";

  image6 = new Image;
  image6.src = "http://img69.imageshack.us/img69/8756/teamaiden2.png";


-->
</script>
<script>


var rotationtime = onclick;
var i=1;
var int;
function rotate(){
  (i>1)?document.getElementById(i-1).style.display = 'none':document.getElementById('7').style.display = 'none'
  if(i<=7)document.getElementById(i).style.display = 'block';
  i++;
  if(i>8)i=1;
};

window.onload=function(){
  int = setInterval('rotate()', rotationtime);
};


</script>


<center><table width="700px" cellpadding="0" cellspacing="0" align="center" border="0">
 
  <tbody><tr><td style="background-image:url()"><br>

<table class="index" width="100%"><tbody><tr><td class="index">
 

 </td>


</tr>
<tr><td><img src="">
<center><br><img src="http://img528.imageshack.us/img528/7600/teamtitelbild2.png" name="grafixx" border="0" alt="" align="center"><p>

<a onmouseover="document.grafixx.src=image1.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=2"><font color="#D8D8D8">Melinda</font></a> <font color="#A4A4A4">&amp; </font>
<a onmouseover="document.grafixx.src=image3.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=3"><font color="#D8D8D8">Phillis</font></a> <font color="#A4A4A4">&amp; </font>
<a onmouseover="document.grafixx.src=image1.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=4"><font color="#D8D8D8">Piper</font></a> <font color="#A4A4A4">&amp; </font>
<a onmouseover="document.grafixx.src=image3.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=8"><font color="#D8D8D8">Hailey</font></a> <font color="#A4A4A4">&amp; </font>
<a onmouseover="document.grafixx.src=image3.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=12"><font color="#D8D8D8">Aiden</font></a>
  </p></center>


</td>

</div></td></tr></tbody></table>

Folgende Dinge wurden mir gesagt soll ich ändern.
Code:
var rotationtime = onclick;
var i=1;
var int;
function rotate(){
  (i>1)?document.getElementById(i-1).style.display = 'none':document.getElementById('7').style.display = 'none'
  if(i<=7)document.getElementById(i).style.display = 'block';
  i++;
  if(i>8)i=1;
};

window.onload=function(){
  int = setInterval('rotate()', rotationtime);
};

Wäre dankbar für jede Hilfe oder jeden Tipp wie es geht.


Zuletzt von DarkLuna89 am Mi 18 Jul 2012 - 14:19 bearbeitet, insgesamt 2 mal bearbeitet

DarkLuna89
Neuling
Neuling

Weiblich Beiträge : 8
Anmeldedatum : 31.05.12

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [Phpbb 2] Problem mit Mouse Hover Effekt

Beitrag von Günther am Mi 18 Jul 2012 - 14:07

Hallo DarkLuna,

ich hab ihn dir jetzt mal schnell ausgebessert und in meinem Testforum erfolgreich ausprobiert:
Code:
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0"><tbody><tr><td class="row1" rowspan="3" align="center" valign="middle"><div class="gensmall"><script type="text/javascript">
    <!--

      image0 = new Image;
      image0.src = "http://img528.imageshack.us/img528/7600/teamtitelbild2.png";
   
      image1 = new Image;
      image1.src = "http://img502.imageshack.us/img502/4229/teammelinda2.png";

      image3 = new Image;
      image3.src = "http://img521.imageshack.us/img521/3792/teamphillis2.png";

      image4 = new Image;
      image4.src = "http://img833.imageshack.us/img833/5677/teampiper1.png";

      image5 = new Image;
      image5.src = "http://img140.imageshack.us/img140/2622/teamhailey2.png";

      image6 = new Image;
      image6.src = "http://img69.imageshack.us/img69/8756/teamaiden2.png";


    -->
    </script>
    <script>


    var rotationtime = onclick;
    var i=1;
    var int;
    function rotate(){
      (i>1)?document.getElementById(i-1).style.display = 'none':document.getElementById('7').style.display = 'none'
      if(i<=7)document.getElementById(i).style.display = 'block';
      i++;
      if(i>8)i=1;
    };

    window.onload=function(){
      int = setInterval('rotate()', rotationtime);
    };


    </script>


    <center><table width="700px" cellpadding="0" cellspacing="0" align="center" border="0">
   
      <tbody><tr><td style="background-image:url()"><br>

    <table class="index" width="100%"><tbody><tr><td class="index">
   

    </td>


    </tr>
    <tr><td><img src="">
    <center><br><img src="http://img528.imageshack.us/img528/7600/teamtitelbild2.png" name="grafixx" border="0" alt="" align="center"><p>

    <a onmouseover="document.grafixx.src=image1.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=2"><font color="#D8D8D8">Melinda</font></a> <font color="#A4A4A4">&amp; </font>
    <a onmouseover="document.grafixx.src=image3.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=3"><font color="#D8D8D8">Phillis</font></a> <font color="#A4A4A4">&amp; </font>
    <a onmouseover="document.grafixx.src=image4.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=4"><font color="#D8D8D8">Piper</font></a> <font color="#A4A4A4">&amp; </font>
    <a onmouseover="document.grafixx.src=image5.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=8"><font color="#D8D8D8">Hailey</font></a> <font color="#A4A4A4">&amp; </font>
    <a onmouseover="document.grafixx.src=image6.src" onmouseout="document.grafixx.src=image0.src" href="http://unwriten-future.forumieren.com/privmsg?mode=post&u=12"><font color="#D8D8D8">Aiden</font></a>
      </p></center>


    </td>

    </div></td></tr></tbody></table>

Funktioniert es auch bei dir, wie gewünscht? Smile

Liebe Grüße
Günther

Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [Phpbb 2] Problem mit Mouse Hover Effekt

Beitrag von DarkLuna89 am Mi 18 Jul 2012 - 14:09

Was genau hast du den da verändert?
Der sieht mir noch genauso aus wie vorher.

EDIT: Ja jetzt funktioniert er perfekt. Was hast du den verändert?

DarkLuna89
Neuling
Neuling

Weiblich Beiträge : 8
Anmeldedatum : 31.05.12

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [Phpbb 2] Problem mit Mouse Hover Effekt

Beitrag von Günther am Mi 18 Jul 2012 - 14:11

Setze ihn mal ein und du wirst sehen, dass er jetzt funktioniert. Wink
Mir ist sofort aufgefallen, dass die Scriptzuweisungen in der unteren Tabellenzeile bei den Verlinkungen nicht den Bildern entsprachen und das habe ich angepasst. Probiere ihn einfach mal so aus. Wink

Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [Phpbb 2] Problem mit Mouse Hover Effekt

Beitrag von DarkLuna89 am Mi 18 Jul 2012 - 14:13

Eingesetzt ist er ja und er funktioniert. Danke

DarkLuna89
Neuling
Neuling

Weiblich Beiträge : 8
Anmeldedatum : 31.05.12

Benutzerprofil anzeigen

Nach oben Nach unten

Erledigt Re: [Phpbb 2] Problem mit Mouse Hover Effekt

Beitrag von Günther am Mi 18 Jul 2012 - 14:18

Bitteschön. Smile

Und zu dem, was dir bzgl. des zitierten Teiles gesagt wurde: Dieser Abschnitt (damit meine ich das gesamte Script um diesen Teil herum) hat zwar nicht den Fehler verursacht, aber ist in dieser vorliegenden Form komplett überflüssig und kann bedenkenlos entfernt werden. Du könntest diesen Teil natürlich aufwändig ändern und korrigieren, aber er ist eigentlich nicht benötigt und kann genausogut einfach weggelassen werden. Wink

Denke bitte noch daran, das -Icon zu setzen.
-done-

Günther
Admin a.D.
Admin a.D.

Männlich Beiträge : 15349
Anmeldedatum : 16.07.08
Firefox

Benutzerprofil anzeigen

Nach oben Nach unten

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach oben


 
Befugnisse in diesem Forum
Sie können in diesem Forum nicht antworten