文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

python测试开发django-188.Bootstrap折叠（Collapse）插件

前言 折叠（Collapse）插件可以很容易地让页面区域折叠起来。如果您想要单独引用该插件的功能，那么您需要引用 collapse.js， bootstrap已经包含了这个插件。.../3.3.7/js/bootstrap.min.js"> <div class="panel-group" id="<em>accordion</em>" role="tablist...<em>在</em>可折叠元素实际显示之前（即在事件发生之前）返回给调用者。shown.bs.collapse .collapse(‘hide’) 隐藏可折叠元素。...<em>在</em>可折叠元素实际被隐藏之前（即在事件发生之前）返回给调用者。hidden.bs.collapse <em>Bootstrap</em> 的折叠类公开了一些用于挂钩折叠功能的事件。...事件类型 描述 show.bs.collapse show调用实例方法<em>时</em>立即触发此事件。 shown.bs.collapse 当折叠元素对用户可见<em>时</em>触发此事件（将等待 CSS 转换完成）。

3K50
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    带你走近AngularJS - 体验指令实例

    使用AngularJS自定义指令结合以下HTML源码同样可以得到预期效果： BootStrap手风琴指令 <btst-accordion...Google Maps 指令 在我们创建指令之前，我们需要添加Google APIs 引用到页面中： <!...这个应用可以改变地图中心和交互地图（当用户通过鼠标按钮选择地图位置时）。同时，地图也会在用户通过滚动选择地图位置时通知应用更新当前显示位置。...function () { if (map && scope.center) map.setCenter(getLocation(scope.center)); }); 监测方法正如我们在文章开始时描述的...创建地图之后，方法会在更新标记的同时添加检测事件，以便监视地图中心位置的变化。该事件会监测当前的地图中心是否和Scope中的相同。

    2.4K50

    3分钟搭建一个网站？腾讯云Serverless开发体验

    作为一个不精通代码的业务玩家，当你想搞个网站玩玩时，经常会被淘宝贵得离谱的报价吓跑。 这两年Serverless的概念被炒得火热，顾名思义，“无服务”。...当然了，Serverless不是表示没有服务器，而表示当您在使用 Serverless 时，您无需关心底层资源，也无需登录服务器和优化服务器，只需关注最核心的代码片段，即可跳过复杂的、繁琐的基本工作。...这样带来的最核心的好处是节省了大量资源，只有你的网站有人访问时，才会计算资源消耗的价格，大幅度降低了成本。 可能你只是想搭建一个博客，以前可能需要买一年的服务器，起码一年开销几百元。.../ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"> <script src="https://cdn.bootcdn.net...当然，这个可能是我自己走得歪路，但是<em>在</em><em>页面</em>上，很难一眼看出来Debug窗口在哪里。 在用户体验上，还有很多事情可以做。 总结 不知不觉又是一篇2500字的文章，一个完整的周末又没有了。

    1.1K40

    Jump Start Bootstrap 第4章

    要通过JQuery触发下拉插件，你需要使用方法dropdown(); $().dropdown('toggle'); 在页面加载后，我们可以使用这个方法把下拉插件的从关闭状态切换到开启状态。...Bootstrap为下拉插件提供了一些附加事件,它们是： show.bs.dropdown: 这个事件在句柄被单击时触发;下拉句柄收到请求去显示隐藏菜单； shown.bs.dropdown: 这个事件在菜单被显示时触发...> 在图中，点击Map链接，页面跳转到Map内容。...它还应该有一个自定义属性data-ride，它告诉Bootstrap在页面加载时就可以启动滑动效果。如果没有这个属性，在您第一次手动操作之前，幻灯片将不会自动更改。...Bootstrap模式对话框有一个选项，当单击该句柄时，将该链接加载到它的modal-body元素中。这个特性在默认情况下是关闭的。

    28.3K40

    3分钟搭建一个网站？腾讯云Serverless开发体验

    作为一个不精通代码的业务玩家，当你想搞个网站玩玩时，经常会被淘宝贵得离谱的报价吓跑。 这两年Serverless的概念被炒得火热，顾名思义，“无服务”。...当然了，Serverless不是表示没有服务器，而表示当您在使用 Serverless 时，您无需关心底层资源，也无需登录服务器和优化服务器，只需关注最核心的代码片段，即可跳过复杂的、繁琐的基本工作。...这样带来的最核心的好处是节省了大量资源，只有你的网站有人访问时，才会计算资源消耗的价格，大幅度降低了成本。 可能你只是想搭建一个博客，以前可能需要买一年的服务器，起码一年开销几百元。.../ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"> <script src="https://cdn.bootcdn.net...当然，这个可能是我自己走得歪路，但是<em>在</em><em>页面</em>上，很难一眼看出来Debug窗口在哪里。 在用户体验上，还有很多事情可以做。 总结 不知不觉又是一篇2500字的文章，一个完整的周末又没有了。

    66020

    bootstrap5基本使用

    前言 bootstrap5官方文档：https://getbootstrap.com/docs/5.1 bootstrap虽然没有Vue强大，但是对于新手快速建造精美的web有着非常大的帮助。...我觉得bootstrap5更像是一个组件库，对于小型网页来说非常的nice。组件库非常精美、简洁。而且上手很快。...导入 css导入 <link href="https://cdn.jsdelivr.net/npm/<em>bootstrap</em>@5.1.3/dist/css/<em>bootstrap</em>.min.css" rel="stylesheet...Column 列的class属性解释： .col-6一行有12列，这个列表示占6份，用来调整列元素的宽度 .col-lg-6当视图宽度大于992<em>时</em>，....col-md-auto当视图大于md<em>时</em>，自动计算宽度，重新排列。 .row-cols-2设置在行元素中，表示一行中最多显示几个列元素。

    39930

    BootStrap基础知识

    2019年实习时的 BootStrap(4.x)基础知识 备份 BootStrap5六角学院文档： HexSchool 顺便推荐一个程序员段子网站 techug.com 栅格系统 栅格类 例：<div...请注意当使用 Bootstrap 预设的 .bg-light 时，你会需要一个适当的文字色彩，例如 .text-dark。这是因为背景通用类别只有 ackground-color 的设定。...另外一定要在 .carousel 上为控制项元件设置一个唯一的 id，特别是当你在一个页面上使用多个轮播的时候。...., 在 slid.bs.carousel 事件发生之前)。 nextWhenVisible 如果页面或是其父层不可见，就停止将轮播循环到下一个。在目标项目显示前回传给调用者。...内联表单需要在 元素上添加 .form-inline 类 所有内联表单中的元素都是左对齐的 在荧幕宽度 小于 576px 时为垂直堆叠，如果荧幕宽度 大于等于 576px 时表单元素才会显示在同一个水平线上

    28010

    10分钟完成一个在线RSS阅读器？腾讯云Serverless Web Function使用体验

    作为一个不精通代码的业务玩家，当你想搞个网站玩玩时，经常会被淘宝贵得离谱的报价吓跑。 这两年Serverless的概念被炒得火热，顾名思义，“无服务”。...这样带来的最核心的好处是节省了大量资源，只有你的网站有人访问时，才会计算资源消耗的价格，大幅度降低了成本。 可能你只是想搭建一个博客，以前可能需要买一年的服务器，起码一年开销几百元。...这时候你访问页面，也返回了同样的结果。.../ajax/libs/twitter-bootstrap/5.0.2/js/bootstrap.min.js"> <script src="https://cdn.bootcdn.net...[008i3skNly1gt1ifx9pxuj31bk0eq79y.jpg] [008i3skNly1gt1ifxodqqj31bk0eq79y.jpg] 当然，这个可能是我自己走得歪路，但是<em>在</em><em>页面</em>上，

    1.2K00

    前端开发者都应知道的 jQuery 小技巧

    预加载图片 如果你的页面使用了大量不能初始可见的图片（例如绑定在 hover 上），预加载它们是十分有用的： $.preloadImages = function () { for...Hover 上的 Class 切换 如果用户的鼠标悬停在页面上某个可点击元素时，你想要改变这个元素的视觉表现。...$('input[type="submit"]').prop('disabled', false); 停止链接加载 有时你不想链接跳转到某个页面或重加载该页面，而希望可以做一些其他事情...但如果想让该元素在第一次点击时显现，第二次点击时消失，下面的代码可以很好地完成这个工作： // Fade $('.btn').click(function () { $('.element').fadeToggle...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function (

    2.3K30

    AJAX控件UpdatePanel使用详解

    但是在一个时间内，它只能限制你的页面用户只能展开其中的一个部分， 每一个 Accordion 控件包括若干个 AccordionPane 控件，AccordionPane 控件可以象 Panel 控件一样...Accordion 控件具有保持其选中状态的功能，当页面发生提交的过程后，Accordion 保留其提交前选中的页面。...如果将 AutoSize 属性设置为 None 它将可能造成页面上的其它元素跟随 Accordion 的尺寸变化产生向上或者向下的移动。...Limit - 它将使得 Accordion 控件永远不能将它的尺寸扩展到规定的高度（Height）属性之外， 如果将 AutoSize 属性设置为 Limit，可能会造成在某种情况下，它里面的内容需要通过滚动条来滚动...Panes - AccordionPane 的集合表示 HeaderTemplate - 当采用数据绑定方式时的标题模板 ContentTemplate - 当采用数据绑定方式时的内容模板 DataSource

    81150

    每个程序员都会的 35 个 jQuery 小技巧

    预加载图片 如果你的页面中使用了很多不可见的图片（如：hover 显示），你可能需要预加载它们： $.preloadImages = function () { for (var i = 0; i...你可以把 img 替换为其他的 ID 或者 class 来检查指定图片是否加载完成。...鼠标悬停(hover)切换 class 属性 假如当用户鼠标悬停在一个可点击的元素上时，你希望改变其效果，下面这段代码可以在其悬停在元素上时添加 class 属性，当用户鼠标离开时，则自动取消该 class...并把要移除的属性作为参数传入： $('input[type="submit"]').removeAttr('disabled'); 阻止链接加载 有时你不希望链接到某个页面或者重新加载它，你可能希望它来做一些其他事情或者触发一些其他脚本...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function ()

    4.4K10

    收集的35个 jQuery 小技巧代码片段，可以帮你快速开发.

    在新窗口中打开链接 XHTML 1.0 Strict doesn’t allow this attribute in the code, so use this to keep the code valid...-- Create an anchor tag -->Back to top 12.预加载图片 如果你的页面中使用了很多不可见的图片（如：hover...你希望改变其效果，下面这段代码可以在其悬停在元素上时添加 class 属性，当用户鼠标离开时，则自动取消该 class 属性： $('.btn').hover(function () { $(this...： $('input[type="submit"]').removeAttr('disabled'); 17.阻止链接加载 有时你不希望链接到某个页面或者重新加载它，你可能希望它来做一些其他事情或者触发一些其他脚本...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function ()

    5.4K20

    ASP.NET MVC使用Bootstrap系列（4）——使用JavaScript插件

    序言 Bootstrap的JavaScript插件是以JQuery为基础，提供了全新的功能并且还可以扩展现有的Bootstrap组件。...为了使用Bootstrap插件，我们需要添加Bootstrap.js或者Bootstrap.min.js文件到项目中。...这两个文件包含了所有的Bootstrap插件，推荐引用Bootstrap.min.js。当然你也可以包含指定的插件来定制化Bootstrap.js，已达到更好的加载速度。...Bootstrap的模态框本质上有3部分组成：模态框的头、体和一组放置于底部的按钮。你可以在模态框的Body中添加任何标准的HTML标记，包括Text或者嵌入的Youtube视频。...在上述容器里添加一个有序列表，它将渲染成小圆点代表当前激活的幻灯片（显示在右下角）。

    5.2K60

    程序员都会的 35 个 jQuery 小技巧

    动态控制页面字体大小 用户可以改变页面字体大小 $(document).ready(function() {   // Reset the font size(back to default)   ...12.预加载图片 如果你的页面中使用了很多不可见的图片（如：hover 显示），你可能需要预加载它们： $.preloadImages = function () {  for (var i = ...15.鼠标悬停(hover)切换 class 属性 假如当用户鼠标悬停在一个可点击的元素上时，你希望改变其效果，下面这段代码可以在其悬停在元素上时添加 class 属性，当用户鼠标离开时，则自动取消该...，并把要移除的属性作为参数传入： $('input[type="submit"]').removeAttr('disabled'); 17.阻止链接加载 有时你不希望链接到某个页面或者重新加载它...').find('.content').hide(); // Accordion $('#accordion').find('.accordion-header').click(function ()

    2.6K00
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券