Forum

CSS-Problem

Erstellt von NiAlMa, 16.04.2011.



  1. NiAlMa

    NiAlMa Nicht mehr ganz neu hier

    Dabei seit:
    10.09.2008
    Beiträge:
    178
    Geschlecht:
    männlich
    Ort:
    Schwabenländle
    Software:
    CC, Lightbox, PSPad, Notepad++
    CSS-Problem
    Hi,

    das Problem mit dem Accordion Menu ist gelöst, allerdings habe ich noch das Problem mit den Aufzählungszeichen - bekomme die einfach nicht weg!

    Wer kann da hilfreich zu Seite stehen?

    html

    HTML:
    1.  
    2. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    3. <script type="text/javascript">
    4.   $(document).ready(function() {
    5.     $("#navi_links li:not(:has(ul))").css("cursor","pointer");
    6.     $("#navi_links li:not(:has(ul))").click(function(){
    7.         $("#navi_links li:has(ul)").slideUp();
    8.         $(this).next().slideDown();
    9.       });
    10.     $("#navi_links li:has(ul)").hide();
    11.   });
    12. <link href="css/my_layout.css" rel="stylesheet" type="text/css" />
    13. <!--[if lte IE 7]>
    14. <link href="css/patches/patch_my_layout.css" rel="stylesheet" type="text/css" />
    15. <![endif]-->
    16. <style type="text/css">
    17. <!--
    18. ul#navi_links a:link {
    19.  color: #FF0; list-style:none;
    20. }
    21. a:visited {
    22.  color: #F00;
    23. }
    24. a:hover {
    25.  color: #F00;
    26. }
    27. a:active {
    28.  color: #FFF;
    29. }
    30. -->
    31.  
    32. ....
    33.  
    34. <div id="main">
    35.         <div id="col1">
    36.           <div id="col1_content" class="clearfix">
    37.             <!-- add your content here -->
    38.             <ul id="navi_links">
    39.  <li class="active"><strong>Home</strong></li>
    40.  
    41.  <li><a href="#">Rund um den Club</a></li>
    42.  <li>
    43.   <ul>
    44.    <li><a href="#">&Ouml;ffnungszeiten</a></li>
    45.    <li><a href="#">Preise</a></li>
    46.    <li><a href="#">Events</a></li>
    47.             <li><a href="#">Rundgang</a></li>
    48.             <li><a href="#">Regeln</a></li>
    49.             <li><a href="#">Kontakt</a></li>
    50.   </ul>
    51.  </li>
    52.  <li><a href="#">Community</a></li>
    53.  <li><a href="#">Service</a></li>
    54.  <li>
    55.   <ul>
    56.    <li><a href="#">Anfahrtsbeschreibung</a></li>
    57.    <li><a href="#">Routenplaner</a></li>
    58.             <li><a href="#">Hotel's</a></li>
    59.   </ul>
    60.  </li>
    61.  <li><a href="#">Allgemein</a></li>
    62.     <li>
    63.      <ul>
    64.          <li><a href="#">Kontakt</a></li>
    65.             <li><a href="#">Impressum</a></li>          
    66.      </ul>
    67.           </div>
    68.         </div>
    69.  
    Ich danke schonmal!

    P.S Ja der Code ist derzeit noch nicht sauber, aber der CSS-Teil wird noch ausgelagert
     
    #1      
  2. fakerer

    fakerer Aktives Mitglied

    Dabei seit:
    03.08.2008
    Beiträge:
    794
    Geschlecht:
    männlich
    CSS-Problem
    AW: CSS-Problem

    ul#navi_links{ list-style:none; }

    sollte klappen

     
    #2      
  3. JannisL

    JannisL Der mit dem Doppel-N ;)

    12
    Dabei seit:
    15.08.2010
    Beiträge:
    1.091
    Geschlecht:
    männlich
    Software:
    Photoshop CS5 Ext.,
    Kameratyp:
    Spiegelreflex
    CSS-Problem
    AW: CSS-Problem

    Oder

    #navi_links ul li {list-style:none; }

    So mach ich das immer und es klappt ;)
     
    #3      
  4. sokie

    sokie Mod | Web

    Dabei seit:
    23.03.2008
    Beiträge:
    5.338
    Geschlecht:
    männlich
    Ort:
    Bünde NRW
    Software:
    <br>COREL <br> Texteditor
    CSS-Problem
    AW: CSS-Problem

    damit regelst du nur die li elemente in der in #navi_links genesteten ul, nicht aber alle li elemente der Navigation.
     
    #4      
  5. NiAlMa

    NiAlMa Nicht mehr ganz neu hier

    Dabei seit:
    10.09.2008
    Beiträge:
    178
    Geschlecht:
    männlich
    Ort:
    Schwabenländle
    Software:
    CC, Lightbox, PSPad, Notepad++
    CSS-Problem
    AW: CSS-Problem

    Das Problem konnte behoben werden, allerdings habe ich nun ein anderes!

    Accordion Menu funktioniert wunderbar, allerdins wir der oberste Link (home) grundsätzlich beim Hover blau und unterstrichen dargestellt und ich finde diese Anweisung nirgendwo

    HTML

    HTML:
    1.  
    2. ...
    3.  
    4. <link href="css/my_layout.css" rel="stylesheet" type="text/css" />
    5. <!--[if lte IE 7]>
    6. <link href="css/patches/patch_my_layout.css" rel="stylesheet" type="text/css" />
    7. <![endif]-->
    8. <script type="text/javascript" language="javascript" src="js/jquery.js"></script>
    9. <script type="text/javascript">
    10. $(document).ready(function()
    11. {
    12.  //slides the element with class "menu_body" when paragraph with class "menu_head" is clicked
    13.  $("#firstpane p.menu_head").click(function()
    14.     {
    15.   $(this).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
    16.  });
    17.  //slides the element with class "menu_body" when mouse is over the paragraph
    18.  $("#secondpane p.menu_head").mouseover(function()
    19.     {
    20.       $(this).next("div.menu_body").slideDown(500).siblings("div.menu_body").slideUp("slow");
    21.  });
    22. });
    23.  
    24. <div id="col1_content" class="clearfix">
    25.             <!-- add your content here -->
    26.             <div class="menu_list" > <!--Code for menu starts here-->
    27.   <p class="menu_head"><a href="index.html">Home</a></p>
    28. <!--  <div class="menu_body">
    29. ...
    30.  


    accordion.css

    Code (Text):
    1. @charset "utf-8";[/SIZE]
    2. [SIZE=1]/* CSS Document */[/SIZE]
    3. [SIZE=1].menu_list {[/SIZE]
    4. [SIZE=1] width: 150px;[/SIZE]
    5. [SIZE=1] padding-top: 20px !important;[/SIZE]
    6. [SIZE=1] text-align: left;[/SIZE]
    7. [SIZE=1]}[/SIZE]
    8. [SIZE=1].menu_head {[/SIZE]
    9. [SIZE=1] padding: 10px 10px;[/SIZE]
    10. [SIZE=1] color:#f8f8f8;[/SIZE]
    11. [SIZE=1] background-color:#000504;[/SIZE]
    12. [SIZE=1] cursor: pointer;[/SIZE]
    13. [SIZE=1] position: relative;[/SIZE]
    14. [SIZE=1] margin:1px;[/SIZE]
    15. [SIZE=1] font-weight:bold;[/SIZE]
    16. [SIZE=1] background: #000504;[/SIZE]
    17. [SIZE=1] font-size: 14px;[/SIZE]
    18. [SIZE=1]}[/SIZE]
    19. [SIZE=1].menu_body {[/SIZE]
    20. [SIZE=1] display:none;[/SIZE]
    21. [SIZE=1]}[/SIZE]
    22. [SIZE=1].menu_body a{[/SIZE]
    23. [SIZE=1]  display:block;[/SIZE]
    24. [SIZE=1]  color:yellow;[/SIZE]
    25. [SIZE=1]  background-color:#000504;[/SIZE]
    26. [SIZE=1]  padding-left:40px;[/SIZE]
    27. [SIZE=1]  font-weight:bold;[/SIZE]
    28. [SIZE=1]  text-decoration:none;[/SIZE]
    29. [SIZE=1]}[/SIZE]
    30. [SIZE=1].menu_body a:hover{[/SIZE]
    31. [SIZE=1]  display:block;[/SIZE]
    32. [SIZE=1]  color: red;[/SIZE]
    33. [SIZE=1]  background-color:#000504;[/SIZE]
    34. [SIZE=1]  text-decoration:none;[/SIZE]
    35. [SIZE=1]  }


    Gibt es hierfür eine Lösung? Der Hover sollte eigentlich Yellow ohne deco sein

    Problem ist gelöst! Anweisung kam aus der content.css
     
    Zuletzt bearbeitet: 17.04.2011
    #5      
  6. MegaAdi

    MegaAdi Freak

    1
    Dabei seit:
    20.11.2009
    Beiträge:
    610
    Geschlecht:
    männlich
    Ort:
    Görlitz
    Software:
    Rassierwasser vom Lidl :D
    CSS-Problem
    AW: CSS-Problem

    schön dass du den Fehler selbst behoben hast, aber bitte bitte bitte denk auch an die Leute mit Brille (oder kleine Bildschirmen) und mach deine Schrift nid so klein ;)
    Danke :p
     
    #6      
  7. NiAlMa

    NiAlMa Nicht mehr ganz neu hier

    Dabei seit:
    10.09.2008
    Beiträge:
    178
    Geschlecht:
    männlich
    Ort:
    Schwabenländle
    Software:
    CC, Lightbox, PSPad, Notepad++
    CSS-Problem
    AW: CSS-Problem

    Das ist Absicht da das geschriebene nicht mehr relevant war/ist und ich es eigentlich löschen wollte!
     
    #7      
  8. WebMediaService

    WebMediaService Nicht mehr ganz neu hier

    Dabei seit:
    20.09.2009
    Beiträge:
    76
    Geschlecht:
    männlich
    Ort:
    immer im Süden
    Software:
    Photoshop, Dreamweaver, Fireworks, Illustrator After Effects
    Kameratyp:
    verschiedene - Canon, Nikon
    CSS-Problem
    AW: CSS-Problem

    Da sind noch einige andere Fehler im Navi Quellcode, die du ausräumen solltest. Schau dir mal die letzten 8 Zeilen deiner Navi Links an und überarbeite diese noch einmal.
     
    #8      
Die Seite wird geladen...
Ähnliche Themen
  1. dn3d_fanboy
    Antworten:
    4
    Aufrufe:
    534
  2. qazwsx
    Antworten:
    10
    Aufrufe:
    552
  3. Colincolin
    Antworten:
    6
    Aufrufe:
    520
  4. ubi_sam
    Antworten:
    11
    Aufrufe:
    512
  5. Seppalot
    Antworten:
    3
    Aufrufe:
    597
© 2002 - 2016 PSD-Tutorials.de – ein Projekt mit der 4eck Media GmbH & Co. KG
x
×
×