登录凯特网-QQ技巧|实用软件|技术交流|软件源码|安卓软件!更精彩
【HR】Html 一个实现导航栏切换页面的方法
编程开发 © 文章版权由 admin 解释，禁止匿名转载
评论数
2
浏览数
656
收藏数
0
这个方法主要用到的是标签和<a>标签<br><br><iframe> 标签：<br>#【HR】HTML <iframe> 标签#<br><a>标签：<br>#【HR】HTML <a> 标签#<br>【提示：<a>标签的target属性】<br><br>视频源码地址：<br><div style="border: 1px #f1c84c dashed;color: #7d6828;position: relative;padding: 0.5rem;margin-bottom: 1rem;border-radius: 0.25rem;text-align: center">本帖含有隐藏内容，请您<a href="https://ktwap.net/user/login.html" title="快速跳转" data-pjax> 回复 </a>后查看</div><br><br>希望能给初学者带来帮助！！！</p><p><img src="https://d.ktwap.net/upload/tid/80349/44d53609d4707346791e99c866ab93b1..jpg" alt=""></p> </div> <div class="zz_readall_box pbw cl"> <div class="zz_read_more_mask"></div> <a href="javascript:;" class="zz_read_more_btn">阅读全文</a> </div> <div id="comment_1783737" class="cm"></div> <div id="post_rate_div_1783737"></div> </div> </div> </td> </tr> <tr> <td> <div class="works-show-share cl"> <div class="works-show-share-top"> <div class="wp cl" style="position: relative;"> <div class="share z"> <span>分享：</span> <div class="bdsharebuttonbox"> <a href="#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a> <a href="#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a> <a href="#" class="bds_sqq" data-cmd="sqq" title="分享到QQ好友"></a> <a href="#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a> </div> <script> window._bd_share_config = { "common": { "bdSnsKey": {}, "bdText": "", "bdMini": "2", "bdMiniList": false, "bdPic": "", "bdStyle": "0", "bdSize": "32" }, "share": {} }; with(document) 0[(getElementsByTagName('head')[0] || body).appendChild(createElement('script')).src = '/View/xr_fresh_pc/bdshare/js/share.js?v=1&cdnversion=' + ~(-new Date() / 36e5) ]; </script> </div> <div class="zhanzhuai_dzan"> <a href="javascript:fresh_tp('thread1',80349);" style="display: block;position: relative;padding-top: 5px;"> <span class="bg-zan"></span> <i id="recommendv_add">3</i> </a> </div> <div class="coll-rep y"> <a class="icon-article-jb" href="javascript:;" style="margin-right: 0;"> <i class="zhanzhuai-icons"></i>举报 </a> </div> </div> </div> </div> </td> </tr> <tr class="ad"> <td class="plc"> </td> </tr> </table> </div> </div> </div> <div id="post_list"></div> <div id="post_1783738" class="comment-list"> <div class="zhanzhuai_cleft_avatar"> <a href="https://ktwap.net/u/一亩地.html" target="_blank"> <img src="https://ktwap.net/public/images/user.gif" class="circle js-unveil js-info" uid="171951" pos="right" /> </a> </div> <div class="zhanzhuai_replythread box zhanzhuai_replythread_close""> <table id="pid1783738" class="table_reply plhin" summary="pid1783738" cellspacing="0" cellpadding="0"> <tr> <td class="plc plct" style="width:100%"> <div class="pi"> <strong> <a style="border-radius: 16px 16px 16px 0;border: none;background: #ff4c4c;color: #fff;height: 20px;line-height: 20px;margin-top: 4px;padding: 0 5px">沙发</a> </strong> <div class="pti"> <div class="pdbt"> </div> <div class="authi"> <a href="https://ktwap.net/u/一亩地.html" target="_blank" class="xi2">一亩地</a> <em id="authorposton171951"> 2022-5-16</em> </div> </div> </div> <div class="pct"> <div class="pcb"> <div class="t_fsz"> <table cellspacing="0" cellpadding="0"> <tr> <td class="t_f" id="postmessage_1783738"> 热帖<img class="app-face" src="/public/face/f16.png" alt="[阴险]"> </td> </tr> </table> </div> <div id="comment_1783738" class="cm"></div> <div id="post_rate_div_1783738"></div> </div> </div> </td> </tr> <tr> <td class="plc plcb" style="overflow:visible;--> width:100%"> <div class="po"> <div class="pob cl"> <em> </em> <p class="ricons"> <a class="comment_card_jubao" href="javascript:;"> <i class="icon icon-report" style=" top: 3px;"></i> 举报 </a> <a href="javascript:fresh_tp('post1', 1783738, 'post');"> <i class="icon icon-agree"></i> <span id="review_support_1783738">0</span> </a> </p> </div> </div> </td> </tr> <tr class="ad"> <td class="pls"> </td> </tr> </table> </div> </div> <div id="post_1783739" class="comment-list"> <div class="zhanzhuai_cleft_avatar"> <a href="https://ktwap.net/u/玖月๑.html" target="_blank"> <img src="https://ktwap.net/public/images/user.gif" class="circle js-unveil js-info" uid="148147" pos="right" /> </a> </div> <div class="zhanzhuai_replythread box zhanzhuai_replythread_close""> <table id="pid1783739" class="table_reply plhin" summary="pid1783739" cellspacing="0" cellpadding="0"> <tr> <td class="plc plct" style="width:100%"> <div class="pi"> <strong> <a style="border-radius: 16px 16px 16px 0;border: none;background: #ff8b3d;color: #fff;height: 20px;line-height: 20px;margin-top: 6px;padding: 0 5px">板凳</a> </strong> <div class="pti"> <div class="pdbt"> </div> <div class="authi"> <a href="https://ktwap.net/u/玖月๑.html" target="_blank" class="xi2">玖月๑</a> <em id="authorposton148147"> 2022-5-19</em> </div> </div> </div> <div class="pct"> <div class="pcb"> <div class="t_fsz"> <table cellspacing="0" cellpadding="0"> <tr> <td class="t_f" id="postmessage_1783739"> 奖励结算，当前结算等级：1；少侠辛苦了。 </td> </tr> </table> </div> <div id="comment_1783739" class="cm"></div> <div id="post_rate_div_1783739"></div> </div> </div> </td> </tr> <tr> <td class="plc plcb" style="overflow:visible;--> width:100%"> <div class="po"> <div class="pob cl"> <em> </em> <p class="ricons"> <a class="comment_card_jubao" href="javascript:;"> <i class="icon icon-report" style=" top: 3px;"></i> 举报 </a> <a href="javascript:fresh_tp('post1', 1783739, 'post');"> <i class="icon icon-agree"></i> <span id="review_support_1783739">0</span> </a> </p> </div> </div> </td> </tr> <tr class="ad"> <td class="pls"> </td> </tr> </table> </div> </div> <div id="postlistreply" class="pl comment-list"> <div id="post_new" class="viewthread_table" style="display: none"></div> </div> <div class="pgs cl" style="margin: 15px 0;"></div> <div id="f_pst" class="zhanzhuai_postbox pl box cl" style=" position: relative;"> <div class="cl" id="thread_post_edit"> <div class="hasfsl" id="fastposteditor"> <div class="tedt " style=" border: 0"> <div class="bar" style=" background: #fff; border-bottom: 0;padding: 0;"> <span class="z"> <h1 style=" font-size: 16px;">评论</h1> </span> </div> <style> hide{ padding: 5px 0 5px 10px; margin: 15px 0 13px; background: #f1f1f1; display: block; border: solid 2px #ababab; border-style: dashed; color:#b52020; text-align: center;} </style> <a href="https://ktwap.net/user/login.html" target="_blank">登录</a>后才可发表内容 <script>var fresh_thread_data = {tid: '80349',uid: "211753",user: '坟头上的青年',fid: '5',avatar: '{#WWW}public/images/user.gif'};$(()=>{fresh.page.thread._no()});</script> </div> </div> </div> </div> </div> <div id="zhanzhuai_sidebar" class="zhanzhuai_view_sd"> <div class="viewthread_author box cl"> <img class="author-icon" src="/View/xr_fresh_pc/image/zz_jb.png" alt="" style="position: absolute;left: -5px;top: -5px;"> <sup></sup> <div class="zhanzhuai_viewthread_user_c"> <div class="zhanzhuai_viewthread_user cl"> <div class="viewthread_author_avatar cl"> <a href="https://ktwap.net/u/坟头上的青年.html" target="_blank"> <img src="https://ktwap.net/public/images/user.gif" /> </a> </div> <div class="viewthread_author_info cl"> <a href="https://ktwap.net/u/坟头上的青年.html" target="_blank">坟头上的青年</a> </div> </div> <div class="viewthread_author_mun cl"> <ul class="cl"> <li> <p class="inst">主题</p> <p class="number">14</p> </li> <li> <p class="inst">帖子</p> <p class="number">50</p> </li> <li style="border-right: 0;"> <p class="inst">关注者</p> <p class="number">0</p> </li> </ul> </div> </div> </div> <div class="viewthread_author_threads zz-rfixed box cl"> <div class="zz-side-tit cl"><em></em>TA的新帖</div> <ul> <li> <a href="https://ktwap.net/thread/79842.html">【HR】js实现购物车功能</a> <p>2022-5-18</p> </li> <li> <a href="https://ktwap.net/thread/80349.html">【HR】Html 一个实现导航栏切换页面的方法</a> <p>2022-5-15</p> </li> <li> <a href="https://ktwap.net/thread/80351.html">【HR】HTML <a> 标签</a> <p>2022-5-15</p> </li> <li> <a href="https://ktwap.net/thread/80347.html">【HR】HTML <iframe> 标签</a> <p>2022-5-15</p> </li> <li> <a href="https://ktwap.net/thread/80352.html">【HR】Html5常用标签含义及用法（基础）</a> <p>2022-5-14</p> </li> </ul> </div> <div class="zhanzhuai_vpic zz_related_fixd cl"></div> <script type="text/javascript"> var zz_related = jQuery(".zz_related_fixd").offset().top; var zz_relatedtop = 0; jQuery(window).scroll(function() { zz_relatedtop = jQuery(this).scrollTop(); if (zz_relatedtop >= zz_related) { jQuery(".zz-rfixed").addClass("lists-top-fixed"); } else { jQuery(".zz-rfixed").removeClass("lists-top-fixed"); } }); </script> </div> </div> </div> <script type="text/javascript"> var navH = jQuery("#zhanzhuai-matter-txtbox").offset().top; jQuery(window).scroll(function() { var scroH = jQuery(this).scrollTop(); if (scroH >= navH) { jQuery(".scrollshow").fadeIn(); } else if (scroH < navH) { jQuery(".scrollshow").fadeOut(); } }) </script> <script type="text/javascript"> function pr() { var R = document.getElementById("zhanzhuai_sidebar"); var L = document.getElementById("zhanzhuai_primary"); if (R.className == "sidebar") { R.className = "sidebar-hide zhanzhuai_view_sd"; L.className = "zhanzhuai_view_mn"; } else { R.className = "sidebar"; L.className = "primary"; } } </script> <script type="text/javascript"> var widHeight = jQuery(window).height(); var artHeight = jQuery('.zz_thread_content').height(); if (artHeight > (widHeight * 1.5)) { jQuery('.zz_thread_content').height(widHeight * 1.5 - 285).css({ 'overflow': 'hidden' }); var thread_show = true; jQuery('.zz_read_more_btn').bind('click', bindzz_read_more); } else { thread_show = true; jQuery('.zz_readall_box').hide(); } function bindzz_read_more() { if (!thread_show) { jQuery('.zz_thread_content').height(widHeight * 1.5).css({ 'overflow': 'hidden' }); jQuery('.zz_readall_box').show(); thread_show = true; } else { jQuery('.zz_thread_content').height("").css({ 'overflow': 'hidden' }); jQuery('.zz_readall_box').show(); jQuery('.zz_readall_box').hide(); thread_show = false; } } </script> </div> </div> </div> <div id="ft" class="zz_huxiu_ft"> <div class="wp cl" style="position: relative;"> <div class="zz_huxiu_ft_top cl"> <a href="https://ktwap.net">凯特网</a> <a href="archiver/">Archiver</a> <a href="forum.php?mobile=yes">手机版</a> <a href="forum.php?mod=misc&action=showdarkroom">小黑屋</a> </div> <div class="zz_huxiu_ft_bottom cl"> Copyright © 2019 <a href="https://ktwap.net" target="_blank">凯特网.</a> Powered by <strong><a href="http://bbs.hyphp.cn/" target="_blank">HYBBS</a></strong> <em>2.3.4</em> <p>Runtime:2.5510s Mem:2066Kb</p> </div> <div class="zz_huxiu_ft_icon"> </div> </div> </div> <div class="zz_side_nav_box cl"> <ul class="zz_side_nav"> <li class="zz_side_nav_6"> <a href="javascript:void(0);" class="zz_gototop" title="分享" style=" display: none;"> <i></i> <span>返回顶部</span> </a> </li> </ul> </div> <script type="text/javascript"> jQuery(window).scroll(function() { if (jQuery(window).scrollTop() >= 200) { jQuery('.zz_gototop').fadeIn(300); } else { jQuery('.zz_gototop').fadeOut(300); } }); jQuery('.zz_gototop').click(function() { jQuery('html,body').animate({ scrollTop: '0px' }, 300); }); var sct = jQuery(".zz_company, .zhanzhuai-rfixed, .home-fixd").offset().top; var sctop = 0; jQuery(window).scroll(function() { sctop = jQuery(this).scrollTop(); if (sctop >= sct) { jQuery(".zhanzhuai-rfixed, .p-rfixed").addClass("lists-top-fixed"); } else { jQuery(".zhanzhuai-rfixed, .p-rfixed").removeClass("lists-top-fixed"); } }); jQuery(function () { jQuery.ajax({url: '/ajax/fresh_visitor.html', type:'post'}); }); </script> <link href="https://ktwap.net/Plugin/hy_viewer/css/viewer.min.css" rel="stylesheet"> <script src="https://ktwap.net/Plugin/hy_viewer/js/viewer.js"></script> <script type="text/javascript"> window.onload=function(){ if(typeof document.getElementsByClassName('thread-content')[0] === 'object'){ new Viewer(document.getElementsByClassName('thread-content')[0]); } var jh = document.getElementsByClassName('post-content'); for(var o in jh){ if(typeof jh[o] === 'object'){ new Viewer(jh[o]); } } } </script> </body> </html>
