Home >Web Front-end >JS Tutorial >Introduction to some settings of jquery easyui scroll bar

Introduction to some settings of jquery easyui scroll bar

高洛峰
高洛峰Original
2017-01-11 09:55:541195browse

When using the dialog plug-in, the screen is centered by default. However, when the scroll bar appears on the page, the dialog does not scroll down with the scroll bar. At this time, the user needs to slide the scroll bar to position the dialog, which is not humane. , before telling the solution, let’s popularize several jquery positioning methods

//获取浏览器显示区域的高度 
$(window).height(); 
//获取浏览器显示区域的宽度 
$(window).width(); 

//获取页面的文档高度 
$(document.body).height(); 
//获取页面的文档宽度 
$(document.body).width(); 

//获取滚动条到顶部的垂直高度 
$(document).scrollTop(); 
//获取滚动条到左边的垂直宽度 
$(document).scrollLeft();

ok, the following problem can be easily solved. There are ready-made functions for moving the dialog, but the dialog itself does not have a move function, but Dialog is inherited from panel, and panel has a move function, so you can call panel's move function to move the dialog

$('#dlg').dialog('open'); 
$("#dlg").panel("move",{top:$(document).scrollTop() + ($(window).height()-250) * 0.5});

where $(window).height()-250, where 250px is the width of the dialog.

For more jquery easyui scroll bar settings introduction and related articles, please pay attention to the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn