简体   繁体   English

在页面加载时,默认情况下使用javascript打开href部分

[英]On page load open a href section by default using javascript

I have two navigations and i want the browser to load #informals-1 by default on page load. 我有两个导航,我希望浏览器默认在页面加载时加载#informals-1 How can I do that using javascript? 我该如何使用JavaScript? I have a code to navigate between the -nav and -subnav , but the #informals-1 section is not activated by default. 我有一个代码之间进行导航-nav-subnav ,但#informals-1部分默认情况下不激活。 I have to click on the informals-1 anchor to get the subnav under it. 我必须单击informals-1锚来获取subnav

Before activation - this 激活之前-
After activation - this 激活后- 这个

<nav id="documentation-nav">
<ul>

    <li><a href="#informals-1" title="Informal Events" data-rel="informals"><span>1</span>Informals</a>
    </li>
    <li><a href="#current" title="Technical Events" data-rel="techevents"><span>2</span>Tech Events</a></li>    
</ul>
    </nav>
<nav id="documentation-subnav">
<ul id="informals">
    <li><a href="#informals-1" >Tic Toc</a></li>
    <li><a href="#informals-2" >Jack of all Trades</a></li>
    <li><a href="#informals-3" >Tattoo making</a></li>
    <li><a href="#informals-4" >Face painting</a></li>
    <li><a href="#informals-5" >Foosball</a></li>
    <li><a href="#informals-6" >Solo Impromptu</a></li>
    <li><a href="#informals-7" >Challenge accepted</a></li>
    <li><a href="#informals-8" >Sack Race</a></li>
    <li><a href="#informals-9" >Connected</a></li>
    <li><a href="#informals-10" >Mystery date</a></li>
    <li><a href="#informals-11" >The 90's Game</a></li>
</ul>
<ul id="techevents">
    <li><a href= "#current" title="name1">name1</a></li>
    <li><a href="#tech-2" title="name2">name1</a></li>
    <li><a href="#tech-3" title="name3">name1</a></li>
    <li><a href="#tech-4" title="name4">name1</a></li>
    <li><a href="#tech-5" title="name5">name1</a></li>
</ul>

You can do something like the following. 您可以执行以下操作。

Give the li an id 给李一个id

<li id="yourId"><a href="#informals-1" >Tic Toc</a></li>

then have the window scroll to 500 pixels from top. 然后让窗口从顶部滚动到500像素。 Change 500 to whatever amount is correct for you. 将500更改为适合您的金额。

document.getElementById('yourId').style.display = 'block';
window.scrollTo(0, 500);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 使用href中的javascript导航到其他html页面的div部分 - Navigate to div section of a different html page using javascript in href 从 href 获取 html 文件并使用 vanilla javascript 将其加载到页面中 - get html file from href and load it into the page using vanilla javascript 在将通过单击 href javascript 打开的页面上执行脚本 - execute script on the page that will open by clicking href javascript <a>页面加载时</a>Javascript更新<a>标签的</a>href - Javascript Update href of <a> tag on page load AJAX:跳转到PHP使用xmlhttp.open动态创建的页面的另一部分(onClick()是否在href之前运行?) - AJAX: Jumping to another section in page created dynamically by PHP using xmlhttp.open (does onClick() run before href?) 使用javascript在页面加载时设置默认的启动日期和日期时间值 - Set default bootstrap date and datetime values at page load using javascript 页面加载中的打开标签-Javascript - Open Tab on Page Load - Javascript 在页面加载时打开JavaScript模式 - Open javascript modal on page load 页面加载时使用JavaScript / jQuery的图像的默认多边形区域 - default polygonal area of an image using JavaScript / jQuery on load of page 如何在不使用 href 属性的情况下滚动到页面中的某个部分 - How to scroll to a certain section in a page without using href attribute
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM