Das Forum der Foren
Willkommen im offiziellen Supportforum von Forumieren!  Problem mit eigenem script! Icon_king

Um alle Vorteile unseres Forums zu nutzen, melden Sie sich bitte an. Wenn Sie bereits Mitglied sind, loggen Sie sich ein.

 Problem mit eigenem script! Icons-100

Erstellen Sie ein kostenloses Forum wie dieses hier.
Teammitglieder online
Support-Box
Neue Beiträge seit dem letzten Besuch.
Textbausteine des MODERATIONSTOOL
AB > PFAD > GENERATOR
FORUM > PFAD > GENERATOR
Unterstützung Lösungs-Probleme
Auffällige
User
Der Runde
Tisch
HÄUFIG GESTELLTE FRAGEN
Regeln und nützliche Hinweise
Neueste Themen
» [Mitteilung] SSL-Zertifikat ist nun KOSTENLOS in Forumieren-Foren enthalten
von Bigtuber Heute um 3:12

» [phpBB2] Die Grafik für neue/alte Beiträge über CSS bestimmen
von Bigtuber Gestern um 23:41

» [Invision] Chatbox mit ein Bild versehen
von Bigtuber Gestern um 22:01

» [#15404][phpBB2] Seitenzahlen in den Gruppen
von Dreami Gestern um 19:13

» [AwesomeBB] Gästen erlauben, Blogeinträge zu kommentieren
von Bigtuber Do 19 Sep 2019 - 22:41

» erfunde E-Mails
von Bigtuber Do 19 Sep 2019 - 16:19

» Wie wird die PWA (Progressive Web App) sichtbar angeboten?
von Bigtuber Do 19 Sep 2019 - 2:32

» https bleibt deaktiviert auch nach Erneuerung des erweiterten Pakets
von Bigtuber Di 17 Sep 2019 - 16:35

» E-Mail Adresse ungültig - Benachrichtigung von Forumieren
von Bigtuber Di 17 Sep 2019 - 16:29

» [phpBB3] User kann Beiträge nicht lesen solange er den Text nicht makiert
von MrsDavishalder Mo 16 Sep 2019 - 19:28

» [#15258] Warum habe ich plötzlich Werbung
von Bigtuber Mo 16 Sep 2019 - 18:15

» [phpBB3] Google findet plötzlich das Forum nicht mehr
von Crazy82 Fr 13 Sep 2019 - 12:39

» Domain mit einmonatigem erweitertem Paket kaufen?
von Bigtuber Do 12 Sep 2019 - 14:51

» [phpBB2] Profilfeld erstellen "Error during field configuration"
von Candice Do 12 Sep 2019 - 13:49

» Email Adresse im Impressum ändern
von die Leitbache Di 10 Sep 2019 - 14:37

» Skrill ..
von gingers Mo 9 Sep 2019 - 15:25

» [phpBB3] Verlinkung im Header
von Bigtuber So 8 Sep 2019 - 20:04

» wenn Foren in Vergessenheit geraten.
von Hana19 Sa 7 Sep 2019 - 13:21

Problem mit eigenem script!

Vorheriges Thema anzeigen Nächstes Thema anzeigen Nach unten

 Problem mit eigenem script! Empty Problem mit eigenem script!

Beitrag von Haru am Di 10 Mai 2011 - 21:45

N’abend zusammen
Ich schon wieder, Nachdem sich mein letztes Problem so schnell erledigt hatte, bin ich schon wieder am experimentieren. Und zwar habe ich mir mittels Javasrcipt eine kleine Spielerei für Links zusammen gebastelt.
Kurz: das ganze ist jeweils ein Link (den ich als ‚Kategorie’ benutze) der sich bei einem Mouseover erweitert und die Links zeigt, die in dieser Kategorie sitzen, und ein Banner. An Sich läuft das auch alles glatt und so vie es soll, das einzige was mich momentan rätseln lässt, sind die Hintergrundgrafiken. Diese werden beim Neuladen der Seite angezeigt (ohne weiteren zusammen Hang oder so) obwohl sie erst erscheinen sollten sobald der HoverEffekt einsetzt- Das verwirrenste an der ganzen Sache ist das dies eben nur beim Neuladen so ist. Bleibt man auf der Seite und hat einmal den Effekt aktiviert, verschwindet der Hintergrund wie er eigentlich soll und zeigt den Hintergrund auch nur wieder wenn man erneut auf den Link geht.
Nach dem Neuladen:
 Problem mit eigenem script! 34pci7p
so wie es eigentlich soll/ist:
 Problem mit eigenem script! 2ilzcx4
beim Hover:
 Problem mit eigenem script! Vhb7kk

Link zum Testforum: http://naruto-rpg-fan.forum2ouf.com/
Für den Fall das jemand in einen der Codes schauen möchte/muss, hab ich schon mal alle drei herrausgesucht und werde die unten anhängen. Also wenn irgendjemand eine Idee hat, woran das liegen könnte, würde ich mich natürlich sehr freuen^^

Lg Haru

HTML Code:
Code:
 <ul id="smnavi_menu" class="smnavi_menu">

            <li>
               <a href="#">
                  <img src="http://i53.tinypic.com/27y21ac.jpg" alt=""  />
                  <span class="smnavi_active" style="background: url('http://i52.tinypic.com/21erdqb.jpg')bottom left #111;"></span>
                  <span class="smnavi_wrap" style="width:100px;">
                     <span class="smnavi_link">
                         Forum
                     </span>
                  </span>
               </a>
               <div class="smnavi_box">
                     <a href="http://anime-schul-rpg.forumieren.de/t298-allgemeine-forenregeln-fur-unsere-seite">Die Regeln </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t299-haftungsausschluss">Credits, Wer was wo</a>
                     <a href="http://anime-schul-rpg.forumieren.de/f3-help-feedback">! Hilfe ! </a>
                     <a href="http://anime-schul-rpg.forumieren.de/faq">FAQ… </a>
                     <a href="http://anime-schul-rpg.forumieren.de/memberlist">Mitglieder – Wir</a>
                    </div>
                </li>

             <li>
               <a href="#">
                  <img src="http://i54.tinypic.com/91hxki.jpg" alt=""  />
                  <span class="smnavi_active" style="background: url('http://i51.tinypic.com/16777gk.jpg') bottom left #111;"></span>
                  <span class="smnavi_wrap" style="width:100px;">
                     <span class="smnavi_link">
                         Bewerbungen
                     </span>
                  </span>
               </a>
               <div class="smnavi_box">
                     <a href="http://anime-schul-rpg.forumieren.de/t521-bewerbungsvorlage">Vorlage gefällig ? </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t834-reservierungen">STOPP wir haben genug! </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t723-aufnahmestopps">Reservierungen … </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t822-namensubersicht">Namenliste – die gibt’s schon </a>
                     <a href="#">benutze Avatare </a>
                    </div>
                </li>
            
                <li>
               <a href="#">
                  <img src="http://i53.tinypic.com/5pes6h.jpg" alt=""  />
                  <span class="smnavi_active" style="background: url('http://i51.tinypic.com/20l15xc.jpg') bottom left #111; border: 1px solid #cfcfcf; border-top: 0px solid #cfcfcf; border-right: 0px solid #cfcfcf; border-bottom: 0px;"></span>
                  <span class="smnavi_wrap" style="width:100px;">
                     <span class="smnavi_link">
                         School
                     </span>
                  </span>
               </a>
               <div class="smnavi_box">
                     <a href=" http://anime-schul-rpg.forumieren.de/t517-profile-und-facher">Profile, Fächer, Sport </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t518-schulpersonal">Lehrer, ohne die geht’s nicht! </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t515-das-honey-system">Honey-System? Achso … </a>
                     <a href="http://anime-schul-rpg.forumieren.de/t869-klassenlisten">Klassenlisten – wer ist wo? </a>
                    </div>
                </li>
            
             <li>
             <div class="smnavi_weg">...............</div>
            </li>
            
            </ul>
CSS Code:
Code:

ul.smnavi_menu{
  font-size:12px;
  list-style:none;
  width:150px
}

ul.smnavi_menu a{
  outline:none;
  text-decoration:none
}

ul.smnavi_menu li{
  cursor:pointer;
  float:left;
  height:55px;
  position:relative;
  width:100px}

ul.smnavi_menu li a img{
  border: 1px solid #cfcfcf;
  border-right: 3px solid lightseagreen;
  border-bottom: 0px solid #cfcfcf;
  left:85px;
  position:absolute;
  width:0;
  z-index:4;
}

ul.smnavi_menu li span.smnavi_wrap{
  height:60px;
  left:0;
  top:100px;
  width:210px;
  height:170px;
}

.smnavi_wrap{
border: 1px solid #cfcfcf;
border-top: 0px solid #cfcfcf;
border-right: 0px solid #cfcfcf;
border-bottom: 0px;
}

ul.smnavi_menu li span.smnavi_active{
  height:171px;
  left:0;
  position:absolute;
  top:171px;
  width:210px;
  z-index:3;
}



ul.smnavi_menu li div.smnavi_box a,ul.smnavi_menu li span span.smnavi_descr,ul.smnavi_menu li span span.smnavi_link{
  margin-left:15px;
  text-shadow:1px 1px 1px #000;
  text-transform:uppercase}
 
ul.smnavi_menu li span span.smnavi_link{
  clear:both;
  color:#fff;
  float:center;
  font-size:24px;

 }

ul.smnavi_menu li div.smnavi_box{
  background-color: #fcfcfc;
  border: 1px solid #cfcfcf;
  border-top: 0px solid #cfcfcf;
  border-right: 3px solid lightseagreen;
  display:none;
  height:170px;
  left:0;
  margin-left:20px;
  overflow:hidden;
  padding-left:20px;
  position:absolute;
  top:170px;
  width:210px;
  z-index:2
}

ul.smnavi_menu li div.smnavi_box a{
  clear:both;
  color:#ef5136;
  float:left;
  line-height:20px;
}

ul.smnavi_menu li div.smnavi_box a:first-child{
  margin-top:15px
}

ul.smnavi_menu li div.smnavi_box a:hover{
  color: lightseagreen;
}

.smnavi_weg{
  display:none;
}
JS:
Code:

<script type="text/javascript">$(document).ready(function() {$('#faqs h3').each(function() {var tis = $(this), state = false, answer = tis.next('div').hide().css('height','auto').slideUp();tis.click(function() {state = !state;answer.slideToggle(state);tis.toggleClass('active',state);});});});            $(function() {$('#smnavi_menu > li').bind('mouseenter',function(){var $elem = $(this);$elem.find('img').stop(true).animate({'width':'420px','height':'170px','left':'0px'},400,'easeOutBack').andSelf().find('.smnavi_wrap').stop(true).animate({'top':'140px'},500,'easeOutBack').andSelf().find('.smnavi_active').stop(true).animate({'height':'170px'},300,function(){var $sub_menu = $elem.find('.smnavi_box');if($sub_menu.length){var left = '170px';if($elem.parent().children().length == $elem.index()+1)left = '-170px';$sub_menu.show().animate({'left':left},200);}});}).bind('mouseleave',function(){var $elem = $(this);var $sub_menu = $elem.find('.smnavi_box');if($sub_menu.length)$sub_menu.hide().css('left','0px');$elem.find('.smnavi_active').stop(true).animate({'height':'0px'},300).andSelf().find('img').stop(true).animate({'width':'0px','height':'0px','left':'85px'},400).andSelf().find('.smnavi_wrap').stop(true).animate({'top':'25px'},500);});});</script>
Haru
Haru
Lehrling
Lehrling

Weiblich Beiträge : 44
Anmeldedatum : 08.03.09
keine
phpBB2

Benutzerprofil anzeigen

Nach oben Nach unten

 Problem mit eigenem script! Empty Re: Problem mit eigenem script!

Beitrag von Zuckerpuppe am Mi 11 Mai 2011 - 10:21

Hallo Smile

wo genau hast du das Java-Script denn eingesetzt? Und woher hast du das? Hast du mal nen Link zu der Seite, wo du das her hast?

Nur zur Info: ich bin wirklich kein Script-Profi und weiß nicht, ob ich dir helfen kann. Aber allgemein wäre es gut, wenn man wüsste, wo das Script eingesetzt worden ist. Daher frage ich jetzt mal nach.

Vielleicht kann ja dann jemand helfen, der sich mit Scripten wirklich gut auskennt Wink
Zuckerpuppe
Zuckerpuppe
Admin a.D.
Admin a.D.

Weiblich Beiträge : 19539
Anmeldedatum : 24.04.08
keine
phpBB3

Benutzerprofil anzeigen

Nach oben Nach unten

 Problem mit eigenem script! Empty Re: Problem mit eigenem script!

Beitrag von Haru am Mi 11 Mai 2011 - 11:00

Morgen Zuckerpuppe,
Ich wollte dir hier grade eine Antwortschreiben, das das Scrip direkt im indexbody sitzt und eigentlich auch läuft wie es laufen soll. Als mir der Fehler direkt ins Auge gesprungen ist. Wie ich bereits vermute habe, lag es nämlich nicht am Script selber, sondern an meinen CSS Einstellungen. Ich hatte in meiner active-box die Größe definiert, weswegen sie natürlich auch mit dieser Größe angezeigt wurde (inklusive des Hintergrunds) und nicht wie eigentlich gewollt: erst nicht und später dann.
Von daher würde ich mal sagen: Danke Embarassed für den kleinen doch ausreichenden Anstups den ich gebraucht hatte ^^

lg Haru
Haru
Haru
Lehrling
Lehrling

Weiblich Beiträge : 44
Anmeldedatum : 08.03.09
keine
phpBB2

Benutzerprofil anzeigen

Nach oben Nach unten

 Problem mit eigenem script! Empty Re: Problem mit eigenem script!

Beitrag von Zuckerpuppe am Mi 11 Mai 2011 - 12:51

Das ist ja super, dass du den Fehler gefunden hast Smile

Hast du übrigens wirklich sehr gut gemacht..

Da das Problem gelöst ist, mach ich hier mal wieder zu...

-closed-
Zuckerpuppe
Zuckerpuppe
Admin a.D.
Admin a.D.

Weiblich Beiträge : 19539
Anmeldedatum : 24.04.08
keine
phpBB3

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