Home >Web Front-end >JS Tutorial >Introduction to some settings of jquery easyui scroll bar
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!