playground
/
isotope
mirror of https://github.com/metafizzy/isotope
1
0
Fork 0
Code Issues Releases Activity
Browse Source

require js example code

pull/726/head
David DeSandro 11 years ago
parent
e6ce887e80
commit
0422a1a769
3 changed files with 98 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      .gitignore
  2. 56
      examples/js/require-js.js
  3. 41
      examples/require-js.html

1
.gitignore vendored
Unescape View File

@ -2,3 +2,4 @@ _site
isotope-site.zip
components/
bower_components/
isotope.pkgd.js

56
examples/js/require-js.js
Unescape View File

@ -0,0 +1,56 @@
/*global requirejs: false*/
/*
// with bower components
requirejs.config({
baseUrl: '../bower_components'
});
requirejs( [ '../js/isotope', '../js/layout-modes/masonry' ], function( Isotope ) {
new Isotope( '#basic', {
masonry: {
columnWidth: 60
}
});
});
// */
// isotope.pkgd.js
/*
requirejs( [ 'require', 'js/isotope.pkgd.js' ],
function( require, Isotope ) {
require( [ 'isotope/js/layout-modes/fit-rows' ], function() {
new Isotope( '#basic', {
layoutMode: 'fitRows',
masonry: {
columnWidth: 60
}
});
});
}
);
// */
// isotope.pkgd.js and jQuery
requirejs.config({
paths: {
jquery: '../../bower_components/jquery/jquery'
}
})
requirejs( [ 'require', 'jquery', 'js/isotope.pkgd.js' ],
function( require, $, Isotope ) {
require( [
'jquery-bridget/jquery.bridget',
'isotope/js/layout-modes/masonry'
],
function() {
$.bridget( 'isotope', Isotope );
$('#basic').isotope({
masonry: {
columnWidth: 60
}
});
}
);
});

41
examples/require-js.html
Unescape View File

@ -0,0 +1,41 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>require js</title>
<link rel="stylesheet" href="examples.css" />
<script data-main="js/require-js" src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.5/require.js"></script>
</head>
<body>
<h1>require js</h1>
<div id="basic" class="container">
<div class="item"></div>
<div class="item h4"></div>
<div class="item w2 h2"></div>
<div class="item w2"></div>
<div class="item h3"></div>
<div class="item w3"></div>
<div class="item"></div>
<div class="item h4"></div>
<div class="item"></div>
<div class="item w2 h4"></div>
<div class="item w2"></div>
<div class="item h5"></div>
<div class="item w3"></div>
<div class="item"></div>
<div class="item h4"></div>
<div class="item"></div>
<div class="item w2 h5"></div>
<div class="item w2"></div>
<div class="item h3"></div>
<div class="item w3"></div>
<div class="item"></div>
</div>
</body>
</html>
Write Preview
Loading…
Cancel
Save