php-resource



Zurück   PHP-Scripte PHP-Tutorials PHP-Jobs und vieles mehr > Entwicklung > HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS
 

Login

 
eingeloggt bleiben
star Jetzt registrieren   star Passwort vergessen
 

 

 


HTML, JavaScript, AJAX, jQuery, CSS, Bootstrap, LESS Probleme mit HTML5, Bootstrap oder jQuery ?

Antwort
 
LinkBack Themen-Optionen Thema bewerten
  #1 (permalink)  
Alt 09-10-2006, 03:43
ArSeN
 Registrierter Benutzer
Links : Onlinestatus : ArSeN ist offline
Registriert seit: Feb 2006
Ort: Berlin
Beiträge: 1.052
ArSeN ist zur Zeit noch ein unbeschriebenes Blatt
ArSeN eine Nachricht über ICQ schicken ArSeN eine Nachricht über AIM schicken ArSeN eine Nachricht über Yahoo! schicken
Standard Style via JS anpassen

Hallo liebes Forum!

Da hab ich endlich auch mal wieder ne Frage, und dann auch gleich eine die viele von euch bestimmt lachend beantworten können.

Ich versuche, eine Art JavaScript-Menü zu bauen, sodass bei jedem Klick auf die "Hauptkategorie" eine Liste von Unterkategorien erscheinen soll. Das ganze soll jedoch Vertikal übereinander aufgebaut sein, das heißt also, alle Hauptkategorie-Punkte unter dem auf das man geklickt hat, müssen sich nach unten verschieben.

Mein Ansatz ist: Ich bau ein <span> bzw <div> zwischen die Hauptkategorien, der die Unterkategorien beinhaltet. Zunächst ist jedoch alles Unsichtbar, da die Boxgröße 0 ist. Sobald auf die Hauptkategorie geklickt wird, soll die größe entsprechend angepasst werden. Das war jedenfalls mein ursprünglicher gedanke, aber nachdem ich das mit den größe anpassen überhaupt nicht hinbekommen hab, hab ich folgendes probiert:

PHP-Code:
<script type="text/javascript">
    function 
anzeigen(){
        
document.getElementById("menu1").innerHTML="Hier ist der Text";
        
document.getElementById("menu1").style="border: 1px solid black;";
    }
    function 
verstecken(){
        
document.getElementById("menu1").innerHTML="";
        
document.getElementById("menu1").style="border: 0px;";
    }
</script>

<a href="#" onClick="anzeigen()">Anzeigen</a> <a href="#" onClick="verstecken()">Verstecken</a> 

<div id="menu1" ></div> 
Ich hab leider noch nie richtig was in JavaScript gemacht, sonst hätte ich sicherlich ein bisschen mehr ahnung. Was gutes im Web hab ich auch nich gefunden, was mir bei meinem Problem helfen kann.

Problem ist jetzt: Ich kann keine border einbauen, weil die beim klick auf "Verstecken" immernoch bestehen bleiben würde, wenn auch nur 2px groß.


Weiß jemand Rat? Danke schonmal im Voraus!
__________________
Nur wenige wissen, wieviel man wissen muss, um zu wissen, wie wenig man weiß.
Mit Zitat antworten
  #2 (permalink)  
Alt 09-10-2006, 06:15
pekka
 PHP Master
Links : Onlinestatus : pekka ist offline
Registriert seit: Jun 2001
Ort: Köln
Beiträge: 6.608
pekka befindet sich auf einem aufstrebenden Ast
Standard

Der Ansatz ist nix. Besser: Display oder visibility.

http://de.selfhtml.org/css/eigenscha...ng.htm#display
Mit Zitat antworten
  #3 (permalink)  
Alt 09-10-2006, 14:37
ArSeN
 Registrierter Benutzer
Links : Onlinestatus : ArSeN ist offline
Registriert seit: Feb 2006
Ort: Berlin
Beiträge: 1.052
ArSeN ist zur Zeit noch ein unbeschriebenes Blatt
ArSeN eine Nachricht über ICQ schicken ArSeN eine Nachricht über AIM schicken ArSeN eine Nachricht über Yahoo! schicken
Standard

Hmmm nun gut da magst du wohl recht haben, aber mein eigentliches Problem is ja immernoch, wie passe ich denn den style über javascript an? So wies oben steht funzt es weder im IE noch im FF. Ich hab kA wie ich das machen soll. Wie gehtn sowas?
__________________
Nur wenige wissen, wieviel man wissen muss, um zu wissen, wie wenig man weiß.
Mit Zitat antworten
  #4 (permalink)  
Alt 09-10-2006, 14:40
pekka
 PHP Master
Links : Onlinestatus : pekka ist offline
Registriert seit: Jun 2001
Ort: Köln
Beiträge: 6.608
pekka befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Original geschrieben von ArSeN
Hmmm nun gut da magst du wohl recht haben, aber mein eigentliches Problem is ja immernoch, wie passe ich denn den style über javascript an? So wies oben steht funzt es weder im IE noch im FF. Ich hab kA wie ich das machen soll. Wie gehtn sowas?
indem Du dich über die korrekte Schreibweise informierst.

document.getElementById("menu1").style.border="1px solid black;";

Durch Bindestriche getrennte CSS-Begriffe (etwa "border-top") schreiben sich dabei so:
style.borderTop
Mit Zitat antworten
  #5 (permalink)  
Alt 09-10-2006, 14:47
hall
 Registrierter Benutzer
Links : Onlinestatus : hall ist offline
Registriert seit: Jun 2004
Ort: Berlin
Beiträge: 818
hall befindet sich auf einem aufstrebenden Ast
Standard

http://de.selfhtml.org/javascript/objekte/style.htm
__________________
mfg
Mit Zitat antworten
  #6 (permalink)  
Alt 09-10-2006, 15:20
ArSeN
 Registrierter Benutzer
Links : Onlinestatus : ArSeN ist offline
Registriert seit: Feb 2006
Ort: Berlin
Beiträge: 1.052
ArSeN ist zur Zeit noch ein unbeschriebenes Blatt
ArSeN eine Nachricht über ICQ schicken ArSeN eine Nachricht über AIM schicken ArSeN eine Nachricht über Yahoo! schicken
Standard

Ah - genau das hatte ich nicht gefunden. Ich danke euch vielmals.
__________________
Nur wenige wissen, wieviel man wissen muss, um zu wissen, wie wenig man weiß.
Mit Zitat antworten
  #7 (permalink)  
Alt 09-10-2006, 17:56
ArSeN
 Registrierter Benutzer
Links : Onlinestatus : ArSeN ist offline
Registriert seit: Feb 2006
Ort: Berlin
Beiträge: 1.052
ArSeN ist zur Zeit noch ein unbeschriebenes Blatt
ArSeN eine Nachricht über ICQ schicken ArSeN eine Nachricht über AIM schicken ArSeN eine Nachricht über Yahoo! schicken
Standard Problem mit vertikalem Dropdown-Menü

Hallo!

Ich bin dabei ein Dropdown menü zu schreiben, das Vertikal aufgebaut ist. Undzwar wie folgt:



Auf diesem Bild sieht man, was passiert wenn man einmal auf die Hautpkategorie klickt. Es fährt darunter eine Fläche mit Unterkategorien aus, so wie es sein soll. Leider funktoiniert dies jedoch nur im Internet Explorer. Im FireFox erhalte ich auf der gleichen Seite ein unerklärliches Phänomen, das ich im Folgenden beschreibe.

0 Mal Geklickt

1 Mal Geklickt

2 Mal Geklickt

3 Mal Geklickt

Diese Reihe kann man dann beliebig fortsetzen, und die weiteren Punkte verschieben sich immer weiter nach unten, so dass die weiße Fläche in der Höhe immer größer wird.

Quelltext:

PHP-Code:
<script type="text/javascript">
    function 
drpdwn(id) {
        if (
document.getElementById(id).style.display=='none')
            
document.getElementById(id).style.display='block';
        else 
            
document.getElementById(id).style.display='none';
    }
</script>

<table border=0 cellspacing=0 cellpadding=0 width=175 bgcolor=white><tr><td>
<table width=100% bgcolor=white cellpadding=0 cellspacing=0>
<tr><th bgcolor=#6694E7 align=left colspan=1>
<font class=normtext>Inserate</font></th></tr>
<tr><th bgcolor=#6694E7>
<table border=0 cellpadding=0 cellspacing=0 width=100%>
<tr>
 <td bgcolor=white style='height: 1px;'></td>
</tr>
<tr>
 <td bgcolor=black></td>
</tr>
<tr>
 <td bgcolor=white style='height: 1px;'></td>
</tr>
</table>
</th></tr>
<tr>
             <td bgcolor=#6694E7>
                  <font class=normtext>
                      <a href="javascript:drpdwn('menu1157902883')"><b>Computer & Co.</b></a>
                  </font>
             </td></tr>
             <tr id='menu1157902883' style='display: none'>
             <td bgcolor=#6694E7>                     
                     
                     <font class=normtext>
                         • <a href=af_bs_index.php?af_cat=1157902883><b>Alle Kategorien</b></a><br>
                         • <a href='ulink1'>UNTERLINK 1</a><br>
                         • <a href='ulink2'>UNTERLINK 2</a><br>
                         • <a href='ulink3'>UNTERLINK 3</a><br>
                     </font>
             </td>
             </tr>
             <tr>
                 <td bgcolor=white style='height: 1px;'></td>
           </tr><tr>
             <td bgcolor=#6694E7>
                  <font class=normtext>
                      <a href="javascript:drpdwn('menu1159441333')"><b>Dienstleistungsbörse</b></a>
                  </font>
             </td></tr>
             <tr id='menu1159441333' style='display: none'>
             <td bgcolor=#6694E7>                     
                     
                     <font class=normtext>
                         • <a href=af_bs_index.php?af_cat=1159441333><b>Alle Kategorien</b></a><br>
                         • <a href='ulink1'>UNTERLINK 1</a><br>
                         • <a href='ulink2'>UNTERLINK 2</a><br>
                         • <a href='ulink3'>UNTERLINK 3</a><br>
                     </font>
             </td>
             </tr>
             <tr>
                 <td bgcolor=white style='height: 1px;'></td>
           </tr>

..............
</table></td></tr></table><br></td>
  </tr>
</table> 
Kann mir jemand sagen was ich da falsch mache bzw. woher der Effekt kommt, und / oder wie ich ihn beheben kann?
__________________
Nur wenige wissen, wieviel man wissen muss, um zu wissen, wie wenig man weiß.
Mit Zitat antworten
  #8 (permalink)  
Alt 09-10-2006, 18:06
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard Re: Problem mit vertikalem Dropdown-Menü

Was du falsch machst?

Punkt 1) Du nervst uns mit Doppelpostings. *zusammenführ*

Punkt 2) Du erstellst absolut grottiges HTML. So ein Menü lässt sich wunderbar als Liste auszeichnen, und wieso du immer noch an <font> hängst, kann jedem denkenden Menschen wohl nur ein Rätsel sein.
Kurz gesagt: Du vergewaltigst HTML ganz schön.

Punkt 3) Du weißt einer Tabellenzeile einen Wert für die CSS-Eigenschaft display zu, der höchst ungünstig ist. Der "normale" display-Wert für Tabellenzeilen ist nicht "block".
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #9 (permalink)  
Alt 09-10-2006, 18:11
ArSeN
 Registrierter Benutzer
Links : Onlinestatus : ArSeN ist offline
Registriert seit: Feb 2006
Ort: Berlin
Beiträge: 1.052
ArSeN ist zur Zeit noch ein unbeschriebenes Blatt
ArSeN eine Nachricht über ICQ schicken ArSeN eine Nachricht über AIM schicken ArSeN eine Nachricht über Yahoo! schicken
Standard

Zu 1) Sorry... das Thema hatte nur irgendwie nichmehr ganz gepasst.

Zu 2) Ich weiß, das Problem an dieser Stelle ist aber, dass ich ein gewaltiges Script für jemanden bearbeite, das dummerweise mit Tabellen layoutet. Ich hab den Typ auch gesagt das ich Tabellen im Generellen zum Layouten hasse, aber ich kann ja jetzt nich das ganze Script neuschreiben.

Zu 3) Aha, welches denn dann? Gibts sonst noch ne bessere Möglichkeit?

Danke allenfalls!
__________________
Nur wenige wissen, wieviel man wissen muss, um zu wissen, wie wenig man weiß.
Mit Zitat antworten
  #10 (permalink)  
Alt 09-10-2006, 19:12
wahsaga
  Moderator
Links : Onlinestatus : wahsaga ist offline
Registriert seit: Sep 2001
Beiträge: 25.236
wahsaga befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Original geschrieben von ArSeN
Zu 3) Aha, welches denn dann?
RTFMchen, steht in der CSS-Spezifikation.

Dummerweise kann mit den table-Eigenschaften wiederum der IE nix anfangen ...
Zitat:
Gibts sonst noch ne bessere Möglichkeit?
display einen Leerstring zuweisen zum sichtbar machen - dann nimmt der Browser automatisch den richtigen Defaultwert für das Element.
__________________
I don't believe in rebirth. Actually, I never did in my whole lives.
Mit Zitat antworten
  #11 (permalink)  
Alt 09-10-2006, 19:47
ArSeN
 Registrierter Benutzer
Links : Onlinestatus : ArSeN ist offline
Registriert seit: Feb 2006
Ort: Berlin
Beiträge: 1.052
ArSeN ist zur Zeit noch ein unbeschriebenes Blatt
ArSeN eine Nachricht über ICQ schicken ArSeN eine Nachricht über AIM schicken ArSeN eine Nachricht über Yahoo! schicken
Standard

Super, das mit dem Leerstring funktoiniert auf Anhieb. Danke sehr wahsaga! *hut zieh*
__________________
Nur wenige wissen, wieviel man wissen muss, um zu wissen, wie wenig man weiß.
Mit Zitat antworten
Antwort

Lesezeichen


Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 

Themen-Optionen
Thema bewerten
Thema bewerten:

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an


PHP News

ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlicht
ebiz-trader 7.5.0 mit PHP7 Unterstützung veröffentlichtDie bekannte Marktplatzsoftware ebiz-trader ist in der Version 7.5.0 veröffentlicht worden.

28.05.2018 | Berni

Wissensbestand in Unternehmen
Wissensbestand in UnternehmenLebenslanges Lernen und Weiterbilden sichert Wissensbestand in Unternehmen

25.05.2018 | Berni


 

Aktuelle PHP Scripte

PHP Server Monitor

PHP Server Monitor ist ein Skript, das prüft, ob Ihre Websites und Server betriebsbereit sind.

11.09.2018 Berni | Kategorie: PHP/ Security
PHP WEB STATISTIK ansehen PHP WEB STATISTIK

Die PHP Web Statistik bietet Ihnen ein einfach zu konfigurierendes Script zur Aufzeichnung und grafischen und textuellen Auswertung der Besuchern Ihrer Webseite. Folgende zeitlichen Module sind verfügbar: Jahr, Monat, Tag, Wochentag, Stunde Folgende son

28.08.2018 phpwebstat | Kategorie: PHP/ Counter
Affilinator - Affilinet XML Produktlisten Skript

Die Affilinator Affilinet XML Edition ist ein vollautomatisches Skript zum einlesen und darstellen der Affili.net (Partnerprogramm Netzwerk) Produktlisten und Produktdaten. Im Grunde gibt der Webmaster seine Affilinet PartnerID ein und hat dann unmittelb

27.08.2018 freefrank@ | Kategorie: PHP/ Partnerprogramme
 Alle PHP Scripte anzeigen

Alle Zeitangaben in WEZ +2. Es ist jetzt 03:07 Uhr.