在html中怎样实现当鼠标放到submit按钮上时使鼠标变为单击文字链接时的图标(即手的形状)?

在html中怎样实现当鼠标放到submit按钮上时使鼠标变为单击文字链接时的图标(即手的形状)?,第1张

在html文件中添加一个事件,就是当鼠标滑动到submit按钮上时,设置鼠标样式即可,具体例子如下:

<html>

<body>

<p>请把鼠标移动到单词上,可以看到鼠标指针发生变化:</p>

<span style="cursor:auto">

Default</span><br />

<span style="cursor:pointer">

Pointer</span><br />            <!--这个就是你需要的-->

<span style="cursor:move">

Move</span><br />

<span style="cursor:e-resize">

e-resize</span><br />

<span style="cursor:ne-resize">

ne-resize</span><br />

<span style="cursor:nw-resize">

nw-resize</span><br />

<span style="cursor:text">

text</span><br />

<span style="cursor:wait">

wait</span><br />

<span style="cursor:help">

help</span>

</body>

</html>

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

*{margin: 0pxpadding: 0pxlist-style: nonetext-decoration: none}/*通配符,个人习惯*/

#btn{background: url(https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png)width: 540pxheight: 258px}

</style>

</head>

<body>

<h1>button按钮的背景是图片</h1>

<button id="btn"></button>

</body>

</html>

尝试下面的代码:

<%@ page language="java" contentType="text/htmlcharset=utf-8"

pageEncoding="utf-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8">

<title>放到桌面,发送快捷方式到桌面</title>

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/body.css">

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/mark.css">

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/console.css">

<script type="text/javascript" src="${pageContext.request.contextPath}/js/console.js"></script>

</head>

<body>

<center>

<h2>放到桌面,发送快捷方式到桌面(IE浏览器会显示放到桌面这个按钮,其他浏览器不会显示放到桌面这个按钮)</h2>

<input id="toDesktopButton" type="button" value="放到桌面" onclick="toDesktop(location.href, '软件名称')">

</center>

</body>

<script type="text/javascript">

//将快捷方式发送到桌面

function toDesktop(sUrl, sName) {

try {

var WshShell = new ActiveXObject("WScript.Shell")

var oUrlLink = WshShell.CreateShortcut(WshShell.SpecialFolders("Desktop")

+ "\\" + sName + ".url")

oUrlLink.TargetPath = sUrl

oUrlLink.Save()

alert("成功创建桌面快捷方式!")

} catch (e) {

alert("当前IE安全级别不允许 *** 作或您的浏览器不支持此功能!")

}

}

//判断是否是IE浏览器

function isIE() {

if (!!window.ActiveXObject || "ActiveXObject" in window) {

// alert("是IE浏览器")

return true

} else {

// alert("不是IE浏览器")

return false

}

}

//整个页面加载完之后执行函数

window.onload = function() {

var result = isIE()

if (!result) {

//不是IE浏览器

//获得按钮元素

var toDesktopButtonNode = document.getElementById("toDesktopButton")

//隐藏按钮

toDesktopButtonNode.style.display = "none"

}

}

</script>

</html>


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

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

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

发表评论

登录后才能评论

评论列表(0条)

保存