2017-06-07 6 views
0

Guten Tag,SideBar Keine Anzeige in Ipad

Frage ich schon versuchen alle Updates anzuwenden für Ipad das Menü zum Laufen zu bringen, wie onclick="" und cursor: pointer; ich bereits prüfen, ob die JQuery funktioniert, indem sie: $(document).ready(function(){alert("We accessed the Javascript"); }); Es funktioniert in jedem Gerät, aber in Ipad funktioniert überhaupt nicht, erkennt den Klick nicht und ändert auch nicht die Stilklasse.

Ich benutze als Blueprint dieses Beispiel, dann ich es anpassen, so dass es nicht viel geändert hat. Hier

SlideMenu

ist der große Code, sorry: S:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml" 
     xmlns:pt="http://xmlns.jcp.org/jsf/passthrough" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:c="http://java.sun.com/jsp/jstl/core" 
     xmlns:ui="http://java.sun.com/jsf/facelets" 
     xmlns:p="http://primefaces.org/ui" 
     class="no-js"> 
    <f:view contentType="text/html"> 
     <h:head> 

      <f:facet name="first"> 
       <meta charset="utf-8" /> 
       <meta http-equiv="X-UA-Compatible" content="IE=edge; IE=11; IE=10; IE=9; IE=8; IE=7, chrome=1"/> 
       <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/> 
       <title>BBVA</title> 
       <!-- BOOTSTRAP STYLES--> 
       <link href="${request.contextPath}/assets/css/bootstrap.css" rel="stylesheet" media="all" /> 

       <!-- BBVA fonts --> 
       <link href="${request.contextPath}/assets/css/style2.css" rel="stylesheet" media="all" /> 
       <!--SCRIPTS--> 
       <!---Apple Safari iPad and iPhone Meta Tags--> 
       <meta name="viewport" content="width=device-width"/> 
       <meta name="viewport" content="initial-scale=1.0"/> 
       <meta name="viewport" content="width=992, initial-scale=1, user-scalable=no"/><!--width is pixels, range 200 to 10000--> 
       <meta name="format-detection" content="telephone=no"/> <!--disables automatic detection of possible phone numbers--> 
       <meta name="apple-mobile-web-app-capable" content="yes"/><!--specifies full-screen mode--> 
       <meta name="apple-mobile-web-app-status-bar-style" content="black"/><!--specify full-screen mode first--> 
      </f:facet> 
      <!-- Custom BBVA Theme create by: Alejandro Daza --> 
      <link href="${request.contextPath}/assets/css/style.css" rel="stylesheet" media="all" /> 
      <script src="${request.contextPath}/assets/js/bootstrap.min.js"></script> 
      <script src="${request.contextPath}/assets/js/modernizr.custom.js"></script> 
      <script src="${request.contextPath}/assets/js/style1.js"></script> 
      <script src="http://192.168.0.3:1337/vorlon.js"></script> 
      <script src="${request.contextPath}/assets/js/classie.js"></script> 
     </h:head> 
     <h:body> 
      <script> 
       $(document).ready(function(){ 
        //Check if the current URL contains '#' 
        if(document.URL.indexOf("#")==-1){ 
         // Set the URL to whatever it was plus "#". 
         url = document.URL+"#"; 
         location = "#"; 

         //Reload the page 
         location.reload(true); 
        } 
       }); 
      </script> 
      <div class="container pagina"> 
       <div class="col-md-1 col-lg-1 menu2"> 
         <div class="col-md-4 information nopaddingleft nopaddingright"> 
          <ul class="information_menu"> 
           <li class="active" data-id="1"><a href="onboarding"><i class="icon-home_icon"></i></a></li> 
           <li data-id="2"><a id="showmenu1" onclick="" ><i class="icon-menu_icon"></i></a></li> 
           <div class="spacing"></div> 
           <li data-id="3"><a href="#"><i class="icon-settings_icon"></i></a></li> 
           <li data-id="4"><a href="#"><i class="icon-help_icon"><span class="path1"></span><span class="path2"></span><span class="path3"></span><span class="path4"></span><span class="path5"></span></i></a></li> 
          </ul> 
         </div> 
         <!-- Sidebar --> 
         <div class="menunivel1 menunivelleft1" id="menunivel1"> 
          <ul class="information_menunivel1"> 
           <li class="active" data-id="1"><a href="#"> 
            <img src="../assets/img/perfil.png" style=" width: 35%; position: absolute; left: 13px;top: 13px;" /> 
            <ul class="menuPerfil"> 
             <li> 
              Luci Santodomingo 
             </li> 
             <li> 
              Gerente 
             </li> 
             <li> 
              Oficina Calle 123 
             </li> 
             <li> 
              Bogotá 
             </li> 
            </ul> 
           </a></li> 
           <li><a id="showmenu2" href="#" onclick="" ><p>Gestion comercial <span class="icon-forward_icon flechas"></span></p></a></li> 
           <li><a href="#"><p>Cartera de clientes <span class="icon-forward_icon flechas"></span></p></a></li> 
           <li><a href="#"><p>Oportunidades comerciales <span class="icon-forward_icon flechas"></span> </p></a></li> 
           <li><a href="#"><p>Portal de desarrollo comercial <span class="icon-forward_icon flechas"></span> </p></a></li> 
           <li><a href="#"><p>Portal MIS <span class="icon-forward_icon flechas"></span></p></a></li> 
           <li><a href="#"><p>Alerta de fuga</p></a></li> 
          </ul> 
          <!-- Sidebar --> 
          <div class="menunivel2 menunivelleft2" id="menunivel2"> 
           <ul class="information_menunivel2"> 
            <li class="active"> 
             <a href="#"> 
              <ul class="menuPerfil"> 
              </ul> 
             </a> 
            </li> 
            <li ><a id="showmenu3" href="#" onclick=""><p>Citas para hoy <span class="icon-forward_icon flechas"></span></p></a></li> 
            <li><a href="#"><p>Agenda <span class="icon-forward_icon flechas"></span> </p></a></li> 
            <li data-id="4"><a href="#"><p>Reclamos <span class="icon-forward_icon flechas"></span> </p></a></li> 
           </ul> 
           <!-- Sidebar --> 
           <div class="menunivel3 menunivelleft3" id="menunivel3"> 
            <ul class="information_menunivel3"> 
             <li class="active" data-id="1"> 
              <a href="#"> 
               <ul class="menuPerfil"> 
               </ul> 
              </a> 
             </li> 
             <li><a href="#"><p>Propia</p></a></li> 
             <li><a href="#"><p>Mis Ejecutivos </p></a></li> 
            </ul> 
           </div> 
          </div> 
         </div> 
       </div> 
       <!-- Page Content --> 
       <div class="col-md-11 col-lg-11 contenedorderecha clearfix"> 
        <div class="row contenedorModulos clearfix">     
         <h:form id="principalForm"> 
         <ui:insert name="content"/> 
         </h:form> 
        </div> 
       </div> 
      </div> 
      <script> 
       //<![CDATA[ 
       var menunivel1 = document.getElementById('menunivel1'), 
        menunivel2 = document.getElementById('menunivel2'), 
        menunivel3 = document.getElementById('menunivel3'); 

       $("#showmenu1").click(function(){ 
        classie.toggle(this, 'active'); 
        classie.toggle(menunivel1, 'menu1open'); 
       }); 

       $("#showmenu2").click(function(){ 
        classie.toggle(this, 'active'); 
        classie.toggle(menunivel2, 'menu2open'); 
       }); 

       $("#showmenu3").click(function(){ 
        classie.toggle(this, 'active'); 
        classie.toggle(menunivel3, 'menu3open'); 
       }); 
       //]]> 
      </script> 
     </h:body> 
    </f:view> 
</html> 

Wie man sehen kann ich xhtml verwende, ich weiß nicht, ob das mit dem Thema verbunden ist, oder wenn irgendein Primefaces-Abfrage, die die On-File-Jquery stört.

Ich habe mit diesem Problem seit mehr als 2 Wochen, habe ich die Webseite auf einem lokalen Server, aus Sicherheitsgründen werde ich Ihnen den Link per Chat oder E-Mail zur Verfügung stellen, wenn Sie einen kompletten Blick darauf werfen möchten.

Entschuldigung, mein Englisch ist nicht so toll.

Antwort

0

Einige jquery-Funktionen im Web funktionieren in IPAD oder anderen Geräten nicht auf die gleiche Weise.

Versuchen Sie, diese

$('selector').on('click touchstart', function() { 

}); 

$("#showmenu1").on('click touchstart', function(){ 
        classie.toggle(this, 'active'); 
        classie.toggle(menunivel1, 'menu1open'); 
    });