点击时我有扩展和收缩的div.Masonry库非常适合初始化页面.我遇到的问题是,随着Masonry和下面的指令的绝对定位,当div扩展时,它们与下面的div重叠.我需要让扩展div下面的div向下移动来处理扩展.
我的消息来源是:http: //masonry.desandro.com/
和
https://github.com/passy/angular-masonry/blob/master/src/angular-masonry.js
/*!
* angular-masonry <%= pkg.version %>
* Pascal Hartig, weluse GmbH, http://weluse.de/
* License: MIT
*/
(function () {
'use strict';
angular.module('wu.masonry', [])
.controller('MasonryCtrl', function controller($scope, $element, $timeout) {
var bricks = {};
var schedule = [];
var destroyed = false;
var self = this;
var timeout = null;
this.preserveOrder = false;
this.loadImages = true;
this.scheduleMasonryOnce = function scheduleMasonryOnce() {
var args = arguments;
var found = schedule.filter(function filterFn(item) {
return item[0] === …Run Code Online (Sandbox Code Playgroud) 我正在使用passy的angular-masonry指令在我的应用程序中渲染平铺元素.与许多砌体示例不同,我的砖块不包含图像,只包含通过自定义指令呈现的静态文本和布局内容.我的设置如下:
<div data-masonry
data-column-width="250"
data-load-images="false"
data-preserve-order
data-reload-on-show
data-masonry-options="{ gutter: 15, isFitWidth: true, transitionDuration: 0 }">
<div class="masonry-brick"
data-ng-repeat="event in vm.events | orderBy: 'startTime.toDate()' | filter: (vm.showOnlyRegistered && { going: true })">
<div data-event-item="event"></div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
data-event-item 是我的指令,呈现如下:
<div class="panel panel-default panel-thin light-shadow bgcolor-override event-item-card">
<div class="panel-body" data-ng-class="{'bg-success': event.going}">
<div>
<p class="text-medium text-thin">{{event.name}}</p>
</div>
<p>
<strong>{{event.computed.locationName}}</strong><br />
<span data-ng-if="!event.virtual">{{event.city}}, {{event.state}} {{event.zipCode}}</span>
</p>
<span class="center-block">
<span data-discover-pill data-type="default">
<span class="text-thin">{{event.computed.registrationLabel}}</span>
</span>
</span>
<button type="button"
class="btn push-to-bottom bottom-center"
data-ng-class="{'btn-default': !event.going, 'btn-success': …Run Code Online (Sandbox Code Playgroud)