放在服务器的h5

<!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>

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 219,589评论 6赞 508
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 93,615评论 3赞 396
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 165,933评论 0赞 356
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 58,976评论 1赞 295
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 67,999评论 6赞 393
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 51,775评论 1赞 307
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 40,474评论 3赞 420
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 39,359评论 0赞 276
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 45,854评论 1赞 317
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 38,007评论 3赞 338
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 40,146评论 1赞 351
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 35,826评论 5赞 346
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 41,484评论 3赞 331
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 32,029评论 0赞 22
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 33,153评论 1赞 272
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 48,420评论 3赞 373
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 45,107评论 2赞 356

放在服务器的h5

推荐阅读更多精彩内容