美文网首页
放在服务器的h5

放在服务器的h5

作者: 悟空你又瘦了 | 来源:发表于2018-08-07 22:52 被阅读0次
    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
          <!-- <meta name="divport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0,minimum=1.0,user-scalable=no"> -->
         <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
        <title>帮助与客服</title>
        <style>
    
         * {
             margin:0;
             padding:0;
            }
        .page{
      padding: 1rem 1rem ;
      font-size: 30px;
      color: #000;
      -webkit-overflow-scrolling: touch;  ----解决ios bug
    }
    .content{
       display: flex;
       justify-content: space-between;
       align-content: center;
       border-bottom: 1px solid #E5E5E5;
       height: 4rem;
       font-size: 1rem;
       line-height: 4rem;
    
    }
    .contentHide{
    
       padding-top: 1.5rem;
       padding-bottom: 1.5rem;
       /*border-bottom: 1px solid #E5E5E5;*/
       font-size: 0.8rem;
       color: #404040
        
    }
    .connet{
      position: absolute;
      width: 100%;
      text-align: center;
      left: 0rem;
      bottom: 2rem;
      font-size: 0.8rem;
        vertical-align:middle
    }
    .connet img{
       width: 0.61rem;
      height: 1.22rem;
      margin-left: 0.1rem;
      line-height:1.5rem;
    
    }
    img{
      vertical-align:middle
    }
    .picDown{
      width: 1rem;
      height:1rem ;
      margin-top: 1.6rem
    }
    .picRight{
      width: 1rem;
      height: 2rem
    }
            
        </style>
    </head>
    <body>
    
    
        <div class="page">
    
           <div class="content  title1 " onclick="displayitle1()">
              <span>出境后如何上网?</span>           
              <image src='./pic/ic_help_unfold.png' class="picDown picDown11"></image>
           </div>
    
           <div class="contentHide title11 " style="display:none;">
                 订单成功启用后,您可以在“我的”>“电子发票”中申请“开发票”并下载发票;代金券购买成功后,也可在“我的”>“电子 发票”中申请并下载,开票成功后将不可退款。
                      
          </div>
    
           <div class="content title2" onclick="displayitle2()">
               <span>电子发票如何下载?</span>      
               <image src='./pic/ic_help_unfold.png' class="picDown picDown22"></image>
          </div>
    
           <div class="contentHide title22 " style="display:none;">
               订单成功启用后,您可以在“我的”>“电子发票”中申请“开发
              票”并下载发票;代金券购买成功后,也可在“我的”>“电子
              发票”中申请并下载,开票成功后将不可退款。
          </div>
    
    
           <div class="content title3" onclick="displayitle3()">
               <span>PIN码如何使用?</span>           
               <image src='./pic/ic_help_unfold.png' class="picDown picDown33"></image>
          </div>
          
           <div class="contentHide title33 " style="display:none;">
               订单成功启用后,您可以在“我的”>“电子发票”中申请“开发
              票”并下载发票;代金券购买成功后,也可在“我的”>“电子
              发票”中申请并下载,开票成功后将不可退款。
          </div>
    
    
    
          <div class="content title4" onclick="displayitle4()">
               <span>代金券使用规则</span>
               <image src='./pic/ic_help_unfold.png' class="picDown picDown44"></image>
          </div>
           <div class="contentHide title44 " style="display:none;">
               订单成功启用后,您可以在“我的”>“电子发票”中申请“开发
              票”并下载发票;代金券购买成功后,也可在“我的”>“电子
              发票”中申请并下载,开票成功后将不可退款。
          </div>
    
          <div class="connet" onclick="displayitle5()">        
             联系我们
             <image src='./pic/ic_gray_right_small.png' ></image>
          </div>
    
        </div>
    
    </body>
    <script>
    
      var statementUrl =window.location.href.substring(0,window.location.href.lastIndexOf("\/"))+"/"+ "statement .html"
       var title11 = document.getElementsByClassName("title11")[0];
       var title22 = document.getElementsByClassName("title22")[0];
       var title33 = document.getElementsByClassName("title33")[0];
       var title44 = document.getElementsByClassName("title44")[0];
    
       var picDown11 = document.getElementsByClassName("picDown11")[0];
       var picDown22 = document.getElementsByClassName("picDown22")[0];
       var picDown33 = document.getElementsByClassName("picDown33")[0];
       var picDown44 = document.getElementsByClassName("picDown44")[0];
    
       function displayitle1(obj){
         if (title11.style.display=="none") {
            title11.style.display = 'block';   
           title22.style.display = 'none';
           title33.style.display = 'none';
           title44.style.display = 'none';
           picDown11.setAttribute('src', "./pic/ic_help_hide.png");
           picDown22.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown33.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown44.setAttribute('src', "./pic/ic_help_unfold.png");
         }             
          else{
            title11.style.display = 'none';
            picDown11.setAttribute('src', "./pic/ic_help_unfold.png");
         }
        }
    
       function displayitle2(obj){
         if (title22.style.display=="none") {
            title22.style.display = 'block';
             title11.style.display = 'none';
             title33.style.display = 'none';
            title44.style.display = 'none';
             picDown22.setAttribute('src', "./pic/ic_help_hide.png");
              picDown11.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown33.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown44.setAttribute('src', "./pic/ic_help_unfold.png");
         }             
          else{
            title22.style.display = 'none';
            picDown22.setAttribute('src', "./pic/ic_help_unfold.png");
         }
      }
    
       function displayitle3(obj){
         if (title33.style.display=="none") {
            title33.style.display = 'block';
             title22.style.display = 'none';
           title11.style.display = 'none';
           title44.style.display = 'none';
             picDown33.setAttribute('src', "./pic/ic_help_hide.png");
              picDown22.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown11.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown44.setAttribute('src', "./pic/ic_help_unfold.png");
         }             
          else{
            title33.style.display = 'none';
             picDown33.setAttribute('src', "./pic/ic_help_unfold.png");
         }
      }
    
       function displayitle4(obj){
         if (title44.style.display=="none") {
            title44.style.display = 'block';
             title22.style.display = 'none';
           title33.style.display = 'none';
           title11.style.display = 'none';
            picDown44.setAttribute('src', "./pic/ic_help_hide.png");
             picDown22.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown33.setAttribute('src', "./pic/ic_help_unfold.png");
           picDown11.setAttribute('src', "./pic/ic_help_unfold.png");
         }             
          else{
            title44.style.display = 'none';
            picDown44.setAttribute('src', "./pic/ic_help_unfold.png");
         }
      }
    
      function displayitle5(obj){
       window.open(statementUrl); 
      }
    
    
    </script>
    </html>
    
    

    相关文章

      网友评论

          本文标题:放在服务器的h5

          本文链接:https://www.haomeiwen.com/subject/vjslvftx.html