`

让grid的宽和高随着屏幕大小动态改变

    博客分类:
  • ext
 
阅读更多
在grid中这样设置高和宽:
     width:document.body.clientWidth-205,
     height: document.body.clientHeight-177,
     autoScroll:true,

然后在下面加个方法:
      window.onresize=function(){  //窗口改变时,重新设置一下窗口的宽和高
        patientGrid.setWidth(0); //patientGrid为grid的名称
        patientGrid.setHeight(0);
        patientGrid.setWidth(document.body.clientWidth-205);
        patientGrid.setHeight(document.body.clientHeight-177);
     };
分享到:
评论

相关推荐

    Extjs动态GRID

    在EXTJS中,动态GRID指的是可以实时调整列宽、列数甚至列结构的网格视图,以适应不同的数据需求和用户界面变化。 1. 动态列创建与删除: EXTJS的Grid Panel支持在运行时动态添加或移除列。这可以通过调用`columns....

    wpf 利用Grid动态绘制表格

    Grid是WPF中的一个布局控件,它允许我们将屏幕区域划分为多个行和列,并在这些单元格中放置其他控件。Grid的优势在于它的灵活性,可以精确控制每个单元格的位置和大小。 2. **动态创建Grid** 要动态绘制表格,...

    jQuery响应式可拖拽的元素组件网格布局插件 gridstack.js

    Gridstack.js是一款基于jQuery的响应式可拖拽的元素组件网格布局插件,它提供了一种高效、灵活的方式来组织和管理页面上的动态内容。本文将深入探讨Gridstack.js的功能特性、核心原理以及如何在项目中应用。 一、...

    Grid布局综合Demo案例

    通过使用媒体查询(Media Queries),我们可以根据屏幕尺寸改变网格的结构和大小。例如,当屏幕宽度小于600px时,我们可以重新定义网格布局: ```css @media (max-width: 600px) { .container { grid-template-...

    基于grid布局实现的响应式栅格系统

    在CSS Grid中,可以使用`repeat()`函数动态设定列数,如`grid-template-columns: repeat(12, 1fr)`表示创建12个等宽的列。通过更改`repeat()`的参数,我们可以适应不同的屏幕尺寸。 4. SCSS(Sassy CSS)的应用: ...

    labview 自适应屏幕分辨率程序

    - 利用`Position`和`Size`属性,可以动态地调整控件的位置和大小。 - 使用容器(如框架或面板)来组织界面元素,容器可以设定为自动填充或自动调整大小以适应父容器。 4. **测试程序和可执行文件**: - 包含的...

    WPF 屏幕动态分隔几个区域

    例如,使用VisualStateManager根据窗口大小更改Grid的列数和行数,或者使用AdornerLayer在窗口边缘添加可拖动的分割线,让用户自行调整区域大小。 总之,实现WPF屏幕动态分隔的关键在于合理使用布局容器、数据绑定...

    动态改变较例

    开发者会使用CSS的媒体查询或Flexbox/Grid布局来实现这一目标,确保元素在不同屏幕大小下都能保持合适的比例。 实现动态改变较例的技术包括使用编程语言提供的图形库(如Python的PIL或Java的JavaFX)、CSS的百分比...

    c# 控件大小(及字体)随窗口大小改变自动缩放

    在C#编程中,开发GUI应用程序时,常常需要让界面元素如控件的大小和字体随着窗口尺寸的变化而自动调整,以保持良好的用户体验。这种功能通常被称为“自适应布局”或“动态布局”。本篇文章将深入探讨如何实现C#控件...

    VB控件随窗体大小改变

    在VB(Visual Basic)编程中,常常需要设计用户界面(UI),其中一项常见的需求是让控件随着窗体(Form)的大小改变而自动调整位置和尺寸。这涉及到窗体的Resize事件和控件的Anchor属性。下面我们将深入探讨如何实现...

    WPF listbox width自适应

    标题“WPF listbox width自适应”关注的是如何让`ListBox`的宽度随着窗口的宽度动态调整。在WPF中,我们可以利用几种不同的方法实现这一目标: 1. **使用Grid布局**:在WPF中,`Grid` 是一种非常灵活的布局容器,它...

    LabVIEWlabview论坛-自适应屏幕分辨率.rar

    4. **自定义VI**:开发者可以创建自定义VI来处理屏幕分辨率变化的事件,比如响应窗口大小改变的事件,然后在这个VI中实现界面元素的动态调整。 5. **分辨率独立的单位**:在设计界面时,使用百分比或相对于窗口大小...

    (实例037)动态改变控件尺寸.rar

    `android:layout_width`和`android:layout_height`可以设置为“wrap_content”或“match_parent”,让控件根据内容或父容器大小决定尺寸。另外,`onConfigurationChanged()`方法可用于监听设备方向变化并相应调整...

    组件随窗口大小改变

    3. Grid布局:CSS3的Grid布局则为二维布局提供了强大的工具,使得组件可以按行和列动态调整位置和大小。 三、响应式设计 响应式设计是一种网页设计方法,旨在创建跨设备、跨屏幕尺寸的用户界面。在GUI组件中,响应...

    动态改变表格的行和列

    6. **响应式设计:** 在现代网页开发中,考虑到不同设备的屏幕尺寸,表格可能需要根据窗口大小动态调整行和列。这可以通过媒体查询、CSS Flexbox或Grid布局实现,或者使用JavaScript监听窗口的`resize`事件,根据...

    wpf Grid布局

    - Grid布局非常适合响应式设计,通过动态改变行和列的大小,可以创建自适应不同屏幕尺寸的界面。 8. **数据绑定和模板** - 结合数据绑定和控件模板,Grid可以用来呈现来自数据源的复杂视图,如数据网格。 通过...

    asp.net 控件随着窗口大小按比例变化源码

    例如,可以通过计算屏幕分辨率或浏览器窗口大小,动态设置控件的宽度和高度属性。但这通常不是最佳实践,因为大部分响应式工作应该在客户端完成,以减少服务器负担并提供更好的用户体验。 在压缩包内的"Example012-...

    grid+svg+js实现简单的围棋棋盘

    这个棋盘不仅可以适应各种屏幕尺寸,还能通过调整SVG和CSS参数进行自定义设计,如改变棋盘大小、颜色或添加动画效果。 在提供的压缩包文件中,"go"可能包含了实现这一功能的具体代码,包括HTML、CSS和JavaScript...

    拥抱未来的CSS布局方式flex与grid布局

    "拥抱未来的CSS布局方式flex与grid布局"这个主题将深入探讨两种主流的布局技术:Flexbox(弹性盒布局)和Grid Layout(网格布局),它们彻底改变了我们对网页布局的理解和实践。 **一、Flexbox布局** Flexbox,...

    pb数据窗口美化(grid线条颜色/字体垂直居中)

    4. 测试和调试,确保在各种数据和屏幕尺寸下效果良好。 5. 将美化后的数据窗口集成到主项目中(`main.exe`),并保存相关设置(`main.pbl`、`main.pbt`)。 6. 分享和应用到其他类似场景,如通过导入`dw_style.pbw`...

Global site tag (gtag.js) - Google Analytics