html页面怎么在该页面内部跳转

html页面怎么在该页面内部跳转,第1张

页内跳转,一般使用锚点标记和 Name(名称)属性

name属性用来命名锚点,创建已命名的锚点. 我们可以使用命名了的锚点, 直接跳到一个网页中的指定部分处. 避免用户上下拖动鼠标, 在页面上苦苦寻找.

下面是一个命名锚点的语法:

<a name="label">Text to be displayed</a>

name属性用来创建一个已命名锚点. 锚点的 name(名称)属性的值可以是任何文本, 也就是可以自由设置它的名字,如同css的class命名一样。

下面一行定义了一个已命名锚点:

<a name="tips">有用的提示</a>

一个命名了的锚点并不以特别的方式显示, 与没有命名的锚点显示相同。

为了直接链接到 "tips" 部分, 在URL后面, 添加一个 # 和一个锚点名, 例如:

<a href="/sl.html#tips">跳到有用的提示部分</a>

在文件 "sl.html"内部, 对“有用的提示”部分的超级链接, 是下面这样的:

<a href="#tips">跳到有用的提示部分</a>

<!--JS代码放入HEAD区域-->

<script type="text/javascript">

function dropdown_over(obj,msg,evt){

createTips(obj,msg,evt)

}

function dropdown_out(obj){

removeTips(obj)

}

function createTips(obj,msg,evt){

var p = GetMouse(evt)

var $tips = document.createElement("span")

$tips.id = "tips_" + obj.id

$tips.innerHTML = msg

$tips.style.position = "absolute"

$tips.style.left = p.x+"px"

$tips.style.top = (p.y+16)+"px"

$tips.style.zIndex = 1001

$tips.style.border = "1px solid #666"

$tips.style.backgroundColor = "#FE0"

$tips.style.color = "#000"

$tips.style.fontSize = "10pt"

$tips.style.padding = "3px"

document.body.appendChild($tips)

}

function removeTips(obj){

var $tips = document.getElementById("tips_" + obj.id)

if($tips != null)

document.body.removeChild($tips)

}

function GetMouse(evt){

evt = evt||window.event

return pointer = {

x:evt.pageX || (evt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft)),

y:evt.pageY || (evt.clientY + (document.documentElement.scrollTop || document.body.scrollTop ))

}

}

</script>

<!--BODY中调用-->

<select id="dropdown" onmouseover="dropdown_over(this,'提示信息',event)" onmouseout="dropdown_out(this)">

<option>001</option>

<option>002</option>

<option>003</option>

<option>004</option>

<option>005</option>

</select>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7050116.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-01
下一篇 2023-04-01

发表评论

登录后才能评论

评论列表(0条)

保存