Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/467.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何用HTML在页面上的特定点打开网站?_Javascript_Html_Navigation_Mouse_Dreamweaver - Fatal编程技术网

Javascript 如何用HTML在页面上的特定点打开网站?

Javascript 如何用HTML在页面上的特定点打开网站?,javascript,html,navigation,mouse,dreamweaver,Javascript,Html,Navigation,Mouse,Dreamweaver,初学者程序员所以道歉,如果这是真的很明显 如何让我的网站在页面上的特定点打开(HTML) 我到处都找不到这叫什么!不锚等。该网站将比大多数屏幕更宽和更长我希望屏幕/视口在2500x2500像素背景的正中心打开 我在Mac OS X 10上的DreamWeaver CC中工作 提前谢谢 p、 没有代码可以发布,这是我第一次调用它,你可以使用$(window.width()&$(window.height())和$(window.height()),它是jQuery代码,因此你必须在网页上的jQue

初学者程序员所以道歉,如果这是真的很明显

如何让我的网站在页面上的特定点打开(HTML)

我到处都找不到这叫什么!不锚等。该网站将比大多数屏幕更宽和更长我希望屏幕/视口在2500x2500像素背景的正中心打开

我在Mac OS X 10上的DreamWeaver CC中工作

提前谢谢


p、 没有代码可以发布,这是我第一次调用它,你可以使用
$(window.width()
&
$(window.height())和
$(window.height()
),它是
jQuery
代码,因此你必须在网页上的
jQuery
库中添加应答器脚本。你能告诉我更多你想做什么吗?我很难理解。你不想要任何锚,但你想要?抱歉不理解。

请尝试在页面加载时启动此Javascript

window.onload = function(){
    window.scrollTo(1250, 1250);
}
窗口。scrollTo(x-coord,y-coord)
函数采用两个参数,x-coord是沿文档水平轴的像素,您希望显示在左上角,y-coord是沿文档垂直轴的像素,您希望显示在左上角

我选了1250个,因为这是2500除以2,但是如果你想要屏幕中间的那个位置,你可能需要稍微调整一下。你必须得到屏幕的视口并做一些数学运算

(提示:
window.innerWidth
window.innerHeight
提供尺寸,包括
document.documentElement.clientWidth
document.documentElement.clientHeight
不带
滚动条)


window.scrollTo()
的文档如下:


有关视口尺寸的一些信息可以在此处找到:

正如bryguy所说,您可以计算屏幕的中心并使用scrollTo()。或者,如果要滚动到某个特定元素,请为该元素指定一个id并使用scrollIntoView()函数。您还可以将不可见div居中,绝对定位div,并将顶部和左侧的值设置为50%:

HTML


您可以在没有jQuery的情况下完成这项工作。您可以使用本机JavaScript函数
window.scrollTo()
滚动到中心

要计算屏幕中心,您只需执行以下操作:

用于垂直中心

  • 确定视口高度:视口高度存储在
    document.documentElement.clientHeight
  • 确定整个文档的高度:可以使用
    document.documentElement.offsetHeight
    document.body.scrollHeight
    来获取整个文档的高度
  • 计算:现在只需从文档高度中减去视口高度,然后将其除以2,如下所示:
    (document.documentElement.offsetHeight-document.documentElement.clientHeight)/2
用于水平中心

  • 确定视口的宽度:视口的宽度存储在
    document.documentElement.clientWidth
  • 确定整个文档的宽度:可以使用
    document.body.scrollWidth
    来完成此操作
  • 计算:现在只需从文档宽度中减去视口宽度,然后将其除以2,如下所示:
    (document.body.scrollWidth-document.documentElement.clientWidth)/2
现在是滚动的时候了

最后,您需要使窗口滚动到计算点

window.scrollTo(centerWidth, centerHeight);
如果您想在一个步骤中完成所有操作,请执行以下操作:

window.scrollTo( (document.body.scrollWidth - document.documentElement.clientWidth)/2, (document.body.scrollHeight - document.documentElement.clientHeight)/2 );
请注意,我们使用了document.documentElement.clientHeight(和clientWidth),它们提供了不带滚动条的视口大小。如果希望包含滚动条,则必须使用其他变量。您可以在互联网上找到如何获取这些测量值的示例

有关更多信息:

window.scrollTo(centerWidth, centerHeight);
window.scrollTo( (document.body.scrollWidth - document.documentElement.clientWidth)/2, (document.body.scrollHeight - document.documentElement.clientHeight)/2 );