瀑布流插件Masonry 配置项fitWidth
fitWidth
根据父级容器的尺寸,设置容器的宽,以适应可用的列数。
启用之后可以通过css将容器grid居中
fitWidth: true不适用于组件百分比宽度。
要么通过js给columnWidth设置一个固定宽度,如columnWidth: 120
要么通过css给组件设置一个宽度如:width:120px...
瀑布流插件Masonry 配置项stamp指定组件为stamp,Masonry在布局时会避开这些组件
stamp
指定组件为stamp。Masonry在布局时会避开这些组件。
配置项stamp只在Masonry实例第一次初始化完成后黏贴指定组件,但你可以通过stamp method更改后续的stamp布局。
示例展示>>
瀑布流插件Masonry 配置项percentPosition设置组件的位置(尺寸)为百分比
percentPosition
设置组件的位置(尺寸)为百分比而非像素数。percentPosition: true可以使宽度为百分比的组件不改变他们原本的位置。
测试了一下,true和false没什么区别。
示例展示>>
瀑布流插件Masonry 配置项horizontalOrder组件水平方向从左到右
horizontalOrder:true
使组件水平方向按照从左到右排列
示例展示>>
horizontalOrder:false默认
组件水平方向是无序的
示例展示>>
瀑布流插件Masonry 配置项gutter组件间距
gutter
组件间距
在js配置项gutter可以设置组件的横向间距
示例展示>>
使用CSS margin可设置组件的纵向间距
示例展示>>
在响应式布局中使用组件尺寸将宽度设置为百分比时,可以将gutter的值设置为选择器字符串或者一个元素
...
瀑布流插件Masonry 配置项columnWidth组件宽度
columnWidth
用于在水平网格上对齐组件,设置组件列宽
我们建议设置columnWidth,如果没有设置columnWidth,Masonry将使用第一个组件的外宽作为默认值。
示例展示>>
使用组件尺寸,在响应式布局中奖组件的宽度设置成百分比,设置columnWidth时,将值设置为指定组件选...
瀑布流插件Masonry 配置项itemSelector指定组件
itemSelector
用于指定参与布局的子组件。
建议始终设置项,用于区分参组件元素是否参与布局。
图中的.static-banner是不参与瀑布流的。
示例展示>>
瀑布流插件Masonry
CDN
<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>
<!-- or -->
<script src="https://unpkg.com/masonry-layout...
jQuery实现输入框获取焦点和失去焦点增删css样式
$(".input_ttit").focus(function(){
$(".form_ttit").removeClass("form_ttit_show");
});
$(".input_ttit").blur(function(){
$(".form_ttit").addClass("form_ttit_show...
jQuery添加移除CSS样式
1. addClass() - 添加CSS类
$("#target").addClass("newClass");
//#target 指的是需要添加样式的元素的ID
//newClass 指的是CSS类的名称
2. removeClass() - 移除CSS类
$("#target").removeClass("oldClass");
...
Js/Jquery获取网页屏幕可见区域高度
js
document.body.clientWidth ==> BODY对象宽度
document.body.clientHeight ==> BODY对象高度
document.documentElement.clientWidth ==> 可见区域宽度
document.documentElement.cl...
jquery判断是否存在某个input
代码:
if($('input').length){
//有input
}
else{
//没有input
}
具体到某个input
例如:
<input type='text' id='attr_name_1' value=''/>
<input type='text' id='attr...
jQuery获取当前标签的id
方法一id = e.id;
<a href="javascript:;" class="list-group-item h11" onclick="test(this)" id="8">测试</a>
//js写法
function test(e) {
var id = e.id;
console...
jQuery-zclip实现复制内容到剪切板
jQuery-zclip是一个复制内容到剪贴板的jQuery插件,使用它我们不用考虑不同浏览器和浏览器版本之间的兼容问题。jQuery-zclip插件需要Flash的支持,使用时记得安装Adobe Flash Playe
这里需要注意的就是,这个插件,必须在服务器的环境中才能正常显示效果。
代码:下载链接:https://fi...
formValidator防止重复提交
<script>
$(function () {
$.formValidator.initConfig({
theme:'Default',mode:'AutoTip',formID:"myform",debug:true,submitOnce:true,onSuccess:function(){
...
formValidator用letter_u验证大写字母不管用
注意param这个参数 如果不写的话是默认不区分字母大小写的
整了一下午 大小写字母正则验证 一开始以为是正则表达式的问题,后来发现是因为这个参数 !!!!!!!!!!!!!!!
$("#userPassword").formVal...
关于本站
“最难不过坚持”
本人承接扒站仿站,php网站维护,病毒查杀,网站编辑,网站改版,html制作
有需要网站维护,改版,病毒查杀,网站编辑,网站备案,html制作等相关的工作可以联系我。
本人有多年相关工作经验,也可提供免费咨询,交个朋友。
有需要探讨问题的朋友,也可以加我微信,共同探讨!
微信:15011482830 QQ:408917339
2655
39
分类目录
最新评论
- https://jueru.net/
-
- :weixiao:
-
- :shuijiao: :weiqu: :zhenbang: :leng:
-
- :yiwen: :yiwen: :yiwen: :yiwen:
-
- 这个业务逻辑多少都有点奇怪了,阅读浏览次数增值在新闻详情页的控制器方法里setInc,这怎么还写进模型事件里了。如果非要用onAfterRead也可以,把新闻文章的内容单独分出来一个news_content表,然后把它和news做关联,然后给news_content表的onAfterRead事件做增值处理,这样点进新闻页内查询到文章内容时才会触发它。
-
文章标签更多