ilch Forum » Ilch Clan 1.1 » Design und Templates » Navigation geht auf iPhone nicht

Geschlossen
  1. #1
    User Pic
    heinz2 Mitglied
    Registriert seit
    05.10.2013
    Beitrge
    167
    Beitragswertungen
    2 Beitragspunkte
    Hallo Leute,
    nachdem ich das mit der Navigation wie ich sie hinbekommen wollte nicht geschafft habe, heute ein kleines neues Problem.
    Ich kann kein Untermenue in der horizontalen Menueleiste öffnen mit dem iPhone. Vieleicht hat jemand ein ähnilches Problem und kann mir ein paar Tips geben woran es liegen könnte.

    Anbei mein Daten:
    navi.css
    * {
     margin:0;
     padding:0;
     list-style:none;
     text-decoration:none;
    }
    
    
    ul#navi  {
      float:left 200px;
      background:#FFFF80;         /* Hintergrundfarbe 1. Zeiele */
      width:100%;                 /* gendert von 150px auf 100% */
    }
    
    /* Alle A Elemente zum Blockelement befrdern */
    ul#navi a {
     display:block;  /* Die wichtigste Regel ist display:block und sorgt dafr, dass sich das A-Element ber die gesamte Breite der Navigation erstreckt. */
     padding:5px;
     color:#0000FF;
     font-weight:bold;
     border-right:1px solid #fff;
     text-align:center;
    }
    
    /* Alle LI Elemente relativ positionieren */
    ul#navi li  {
     position:relative;             /* Alle LI Elemente relativ positionieren */
     float:left;                    /* hinzugefgt um eine horizontale Ausrichtung zu erzielen */
     width:7.075em;                  /* Hinzugefgt 150px / 16 = 9.375em */
    }
    
    /* Alle Ebenen ausblenden */
    /* Alle UL Elemente ausblenden bzw. ins Aus befrdern */
    ul#navi ul  ,
    ul#navi  li:hover ul ul ,
    ul#navi  li:hover  ul ul ul  {
     position:absolute;
     left:-9999px;
     background:#808080;  /* Farbe Hover einmalig */
    }
    
    ul#navi  li:hover ul {
     /*  background:#0000FF; */
    /*   background-image: url(Bilder/menu/hinter2.jpeg); */
    }
    
    ul#navi  li:hover ul ul {
      background:#777;
    }
    
    ul#navi  li:hover ul ul ul {
      background:#444;
    }
    
    ul#navi ul {
     top:auto;                    /* Neue Position definiert 16px Schriftgre + (2 x 5px) padding = 30px / 16 = 1.875em*/
    }
    
    
    /* Einzelne Ebenen einblenden */
    ul#navi li:hover ul  {
     left:0;
     }
    
    
                                     /* Neuer Deklarationsblock um die Unterpunkte przise zu positionieren */
    ul#navi ul  li:hover  ul ,
    ul#navi ul  ul li:hover  ul  {
     position:absolute;
     left:100%;
     top:0;
     }
    
    
    /* Hover Hinter- und Vordergrundfarbe fr alle Ebenen */
    ul#navi li:hover > a , ul#navi  ul li:hover  > a, ul#navi ul  ul  li:hover  > a, ul#navi ul  ul ul  li:hover  > a  {
    background:#808080;
    /*   background-image: url(Bilder/menu/hinter2.jpeg); */
      color:#0000FF;
    }
    
    ul#navi a span {
     float:right;
      font-weight:normal;
      }
    ,

    _________________________________________________________

    Ausschnitte aus der index.htm
    schnipp-----------------------------
    
    <title>{TITLE}</title>
    <link rel="stylesheet" type="text/css" href="include/designs/aonl/style.css" />
    <link rel="stylesheet" type="text/css" href="include/designs/aonl/navi.css" />
    <link rel="stylesheet" type="text/css" href="include/designs/aonl/dropdown_one.css" />
    
    <script type="text/javascript">
              var lastboxmen = 2;
              var chosenlastboxmen = 1;
              function togglelastboxmen (tolastboxmen) {
                  tolastboxmen = isNaN(tolastboxmen) ? 0 : tolastboxmen;
                  if (tolastboxmen < 1 || tolastboxmen > lastboxmen) {
                      tolastboxmen = (chosenlastboxmen < lastboxmen) ? chosenlastboxmen + 1 : 1;
                 }
                 document.getElementById('lastboxmen_'+chosenlastboxmen).style.display = 'none';
                 document.getElementById('lastboxmen_'+tolastboxmen).style.display = '';
                 chosenlastboxmen = tolastboxmen;
             }
    </script>
    
    <!--START SIMPLEVIEWER EMBED.-->
    <script type="text/javascript" src="svcore/js/simpleviewer.js"></script>
    <script type="text/javascript">
    simpleviewer.ready(function () {
    simpleviewer.load("sv-container", "100%", "100%", "66FFFF", true);
    });
    </script>
    <div id="sv-container"></div>
    <!-- END SIMPLEVIEWER EMBED -->
    
    <!--[if lte IE 7]>
    <link type="text/css" rel="stylesheet" media="all" href="include/includes/css/messenger/screen_ie.css" />
    <![endif]-->
    
    <!-- ENDE -->
    <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
      <link rel="stylesheet" type="text/css" href="include/extras/fancybox/jquery.fancybox.css" media="screen" />
      <script type="text/javascript" src="include/extras/fancybox/jquery.fancybox.pack.js"></script>
      <script type="text/javascript" src="include/extras/fancybox/jquery.easing.1.3.js"></script>
      <script type="text/javascript">
    	$(document).ready(function() {
    		$("table#galimages a").fancybox(
    		{
    		'zoomSpeedIn': 800,
    		'zoomSpeedOut': 500,
    		'zoomSpeedChange': 800,
    		'zoomOpacity': 0.5,
    		'overlayOpacity': 0.5,
    		'easingIn' : 'easeOutBack',
    		'easingOut'	: 'easeInBack',
    		'overlayShow': true
    		}
    		);
    
    		$("div#bbvideo a").fancybox(
    		{
    		'zoomSpeedIn': 800,
    		'zoomSpeedOut': 500,
    		'zoomSpeedChange': 800,
    		'zoomOpacity': 0.5,
    		'overlayOpacity': 0.5,
    		'overlayShow': true
    		}
    		);
    	});
       </script>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Fischerfreunde Haimhausen e.V.</title>
    <link rel="SHORTCUT ICON" href="img/favicon.ico">
    </head>
    <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    
    
    
    schnipp-----------------------------
    schnipp-----------------------------
    
            <table width="100%" height="5" border="0" cellpadding="0" cellspacing="0" bgcolor="#C0C0C0">
                <tr>
                <td>
                    <ul id="navi">
                    </li>
                       {_list_menunr5@
                          	<li><a><b>%1</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
            	<!--[if lte IE 6]><table><tr><td><![endif]-->
                    <ul>
                    <li>
                    %2
                    </li>
                    </ul>
                      	<!--[if lte IE 6]></td></tr></table></a><![endif]-->
                    </li>
                       }
                    </ul>
    
                </td>
                </tr>
            </table>
    
    schnipp-------------------


    Danke schon einmal im Voraus.

    MfG heinz2


    verwendete ilch Version: 1.1 P

    betroffene Homepage: fischerfreunde-haimhausen.de
    0 Mitglieder finden den Beitrag gut.
  2. #2
    User Pic
    Rock@wulf Hall Of Fame
    Registriert seit
    03.06.2004
    Beitrge
    3.282
    Beitragswertungen
    239 Beitragspunkte
    Responsive Desing ist das Stichwort hier denke ich.

    Bei Mobilgeräten ist immer ein wenig triki aber da können die Designer besser helfen ich habs mal richtig einsortiert.
    Meine Postings repräsentieren meine Meinung wenn nicht anders gekennzeichnet.
    MFG Rock@wulf
    0 Mitglieder finden den Beitrag gut.
  3. #3
    User Pic
    holz Hall Of Fame
    Registriert seit
    17.11.2005
    Beitrge
    4.606
    Beitragswertungen
    117 Beitragspunkte
    ja vielleicht schaust du dir mal ein framework wie bootstrap an ... das unterstützt dich da sehr gut ....

    wenn dus selber machen willst

    google nach responsive und media queries da solltest du dann alles nötige finden
    0 Mitglieder finden den Beitrag gut.
  4. #4
    User Pic
    heinz2 Mitglied
    Registriert seit
    05.10.2013
    Beitrge
    167
    Beitragswertungen
    2 Beitragspunkte
    Danke für die schnelle Antwort. Da werde ich mich mal darüber her machen. und zum Schluss berichten wie es ausgegangen ist.

    MfG heinz2
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurck zu Design und Templates

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten