<html>
<head>
<meta http-equiv="content-type" content="text/htmlcharset=GB2312" />
<title>CSS和Js演示网页绝对定位与相对定位</title>
<!-- 通用样式表 -->
<style>
* { font-size:12pxfont-family:宋体, Arial} /*规定了所有的字体样式*/
body { overflow:autoborder-style:nonemargin:0pxpadding:0px}
.tools { position:absolutetop:180pxleft:10px}
#abs { position:absoluteleft:10pxtop:10pxwidth:150pxheight:150pxbackground-color:buttonfacepadding:10px}
#rel { position:relativeleft:170pxtop:40pxwidth:150pxheight:120pxbackground-color:buttonfacepadding:10px}
</style>
<script>
function logEvent(){
$("ipt_x").value = event.x
$("ipt_y").value = event.y
$("ipt_x2").value = event.clientX
$("ipt_y2").value = event.clientY
}
function $(str){ return(document.getElementById(str))}
window.onload = function(){
document.onmousemove = logEvent
}
</script>
</head>
<body>
<div id="abs">绝对定位</div>
<div id="rel">相对定位</div>
<div class="tools">
event.x <input id="ipt_x" size="15" >
event.y <input id="ipt_y" size="15" >
<br/>
event.clientX <input id="ipt_x2" size="9" >
event.clientY <input id="ipt_y2" size="9" >
</div>
</body>
</html>
手机js页面实现一键定位,并且把获取的地理位置显示到文本框中代码如下:
var getLocation = function (successFunc, errorFunc) { //successFunc获取定位成功回调函数,errorFunc获取定位失败回调
//首先设置默认城市
var defCity = {
id: '000001',
name: '北京市',
date: curDateTime()//获取当前时间方法
}
//默认城市
$.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(defCity), { expires: 1, path: '/' })
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
var lat = position.coords.latitude
var lon = position.coords.longitude
//var map = new BMap.Map("container") // 创建Map实例
var point = new BMap.Point(lon, lat)// 创建点坐标
var gc = new BMap.Geocoder()
gc.getLocation(point, function (rs) {
var addComp = rs.addressComponents
var curCity = {
id: '',
name: addComp.province,
date: curDateTime()
}
//当前定位城市
$.cookie('VPIAO_MOBILE_CURRENTCITY', JSON.stringify(curCity), { expires: 7, path: '/' })
//alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street)
if (successFunc != undefined)
successFunc(addComp)
})
},
function (error) {
switch (error.code) {
case 1:
alert("位置服务被拒绝。")
break
case 2:
alert("暂时获取不到位置信息。")
break
case 3:
alert("获取位置信息超时。")
break
default:
alert("未知错误。")
break
}
var curCity = {
id: '000001',
name: '北京市',
date: curDateTime()
}
//默认城市
$.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' })
if (errorFunc != undefined)
errorFunc(error)
}, { timeout: 5000, enableHighAccuracy: true })
} else {
alert("你的浏览器不支持获取地理位置信息。")
if (errorFunc != undefined)
errorFunc("你的浏览器不支持获取地理位置信息。")
}
}
var showPosition = function (position) {
var lat = position.coords.latitude
var lon = position.coords.longitude
//var map = new BMap.Map("container") // 创建Map实例
var point = new BMap.Point(lon, lat)// 创建点坐标
var gc = new BMap.Geocoder()
gc.getLocation(point, function (rs) {
var addComp = rs.addressComponents
var curCity = {
id: '',
name: addComp.province,
date: curDateTime()
}
//当前定位城市
$.cookie('VPIAO_MOBILE_CURRENTCITY', JSON.stringify(curCity), { expires: 7, path: '/' })
//alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street)
})
}
var showPositionError = function (error) {
switch (error.code) {
case 1:
alert("位置服务被拒绝。")
break
case 2:
alert("暂时获取不到位置信息。")
break
case 3:
alert("获取位置信息超时。")
break
default:
alert("未知错误。")
break
}
var curCity = {
id: '000001',
name: '北京市',
date: curDateTime()
}
//默认城市
$.cookie('VPIAO_MOBILE_DEFAULTCITY', JSON.stringify(curCity), { expires: 1, path: '/' })
}
一、PC端通过IP实现定位代码
<script type="text/javascript" src="http://fw.qq.com/ipaddress"></script>
<script type="text/javascript">
document.write(IPData[0]) //显示IP地址
document.write(IPData[2]) //显示省
document.write(IPData[3]) //显示市
</script>
二、获取客户端地址代码
<script>
var url = 'http://chaxun.1616.net/s.php?type=ip&output=json&callback=?&_=' + Math.random()
$.getJSON(url, function(data) {
alert(data.Ip)
})
</script>
html页面内可以设置锚点,锚点定义Html代码
<a
name="firstAnchor">&nsbp</a>
锚点使用
Html代码
<a
href="#firstAnchor">跳至第一个锚点</a>
但对于js呢,在js中如何在完成一个操作后跳至页面的某个固定锚点呢
js中location.href可以跳转至某个url;
跳至(定位到)某个固定锚点的办法
1、location.href
=
"#firstAnchor"
//
firstAnchor为锚点名称
2、window.location.hash
=
"#firstAnchor"
//
firstAnchor为锚点名称
经测试:hash只会在跳转到此页面的第一次起作用,再次刷新此页面将不起作用,而href始终起作用
以上这篇js
定位到某个锚点的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。