首页 > 其他分享 >ligerLayout布局(左右分栏)

ligerLayout布局(左右分栏)

时间:2023-04-25 17:35:21浏览次数:36  
标签:function 菜单 ligerLayout 左右分 布局 height

场景需求:左边框框用来放树菜单,右边就是点击菜单后显示的内容

js

$(function () {
    $("#layoutMain").ligerLayout({
        topHeight :80,
        leftWidth: 180, 
        height: '100%'
        });
});

 

html

     <div id="layoutMain" style="width:99.2%; margin:0 auto; margin-top:4px;">
          <div position="left" id="accordion1"  title="变电站名称"> 

           </div>     
       
           <div position="center" id="framecenter"> 

           </div>
       </div>

 

效果

 

标签:function,菜单,ligerLayout,左右分,布局,height
From: https://www.cnblogs.com/rdchen/p/17353311.html

相关文章

  • 阮一峰 Flex 布局教程:语法篇
    网页布局(layout)是CSS的一个重点应用。布局的传统解决方案,基于盒状模型,依赖 display 属性+ position属性+ float属性。它对于那些特殊布局非常不方便,比如,垂直居中就不容易实现。2009年,W3C提出了一种新的方案----Flex布局,可以简便、完整、响应式地实现各种页面布局。......
  • 答题积分小程序云开发实战-界面交互篇:注册登录页布局样式与逻辑交互开发
    微信小程序云开发实战-答题积分赛小程序界面交互篇:注册登录页布局样式与逻辑交互开发写在前面-开发调试小技巧模拟器通常默认展示的页面是首页,那么如果我们想切换到其他页面呢,那怎么办?我这里教给初学者三种方式,方便大家在搭建页面过程中,进行开发调试。点击事件跳转给页面按钮添加一......
  • Rails 中的布局和渲染
    Templates,Partials,andLayouts在Rails中,视图是用于呈现HTML、XML、JSON等响应的模板。Rails的视图系统支持模板、局部模板和布局模板,它们分别用于分离代码、提高代码重用性和提供统一的外观。模板是视图的基本构建块。模板可以包含HTML、Ruby代码和其他标记,以生成动......
  • 前端必须学会的vueh5布局瀑布流 简易通俗易懂 左右排版
    css简易版瀑布流布局通过v-if="index%2===0"v-if="index%2===1"进行判断显示左边右边左右瀑布流排版,在每一列中交替地排放元素。具体来说,可以通过对每一列进行编号,然后对奇数列和偶数列分别设置不同的样式来实现左右瀑布流排版。html<div><cl-pull-refreshv-model="isR......
  • 使用flex弹性造APP首页轮子【前端Flex弹性布局】
    一.使用flex弹性造一个APP首页轮子这是内科大企业课(全栈开发_web前端的课程),需求如下:使用Flex弹性布局,仿写下面的页面:二.需求分析和完成步骤先分析这个页面,我们可以先写一个大的盒子,作为整个页面:<divid="content"></div>设置其为弹性布局,排列顺序为从上到下#content{......
  • 仿chatGPT或chatPDF的前端界面布局,css实现对话聊天布局代码,响应式左右分栏布局(附完整
    chatPDF或者chatGPT的界面挺简洁的,就是一个左侧的列表以及右侧的对话列表,现在使用css实现这样的布局充分运用了flex布局方式实现,左右分栏,以及对话形式展示效果下面是效果图: 在手机设备看就隐藏左侧,右侧100%适应 下面就是html和css的布局代码<style>.chatpdf{......
  • 电力布局三维编辑器功能设计
    楔子最近和一家公司在谈一个项目合作,他们公司主要是做电力相关的。项目背景大概是这样的:国家电网对电网资产需要做到数字化管理,对现有变压器台区内的电表箱电能表做可视化数字孪生管理。由于涉及到的台区非常多,所以客户希望开发的不是单个项目,而是可以实现项目的3D编辑器,使得......
  • 01-CSS中的非布局样式
    title:01-CSS中的非布局样式publish:true前言CSS中,有很多非布局样式,这些样式(属性)和与布局无关,包括:字体、字重、颜色、大小、行高背景、边框滚动、换行装饰性属性(粗体、斜体、下划线)等。这篇文章,我们来对上面的部分样式做一个回顾。边框如何用边框画一个三角形?详见......
  • 02-CSS布局
    title:02-CSS布局publish:true前言常见的布局属性(1)display确定元素的显示类型:block:块级元素。inline:行内元素。inline-block:对外的表现是行内元素(不会独占一行),对内的表现是块级元素(可以设置宽高)。(2)position确定元素的位置:static:默认属性值。relative:......
  • 13-CSS3属性:Flex布局图文详解
    title:13-CSS3属性:Flex布局图文详解publish:true前言CSS3中的flex属性,在布局方面做了非常大的改进,使得我们对多个元素之间的布局排列变得十分灵活,适应性非常强。其强大的伸缩性和自适应性,在网页开中可以发挥极大的作用。flex初体验我们先来看看下面这个最简单的布局:......