epifanio67
asked on
reference errors with Masonry javascript grid layout lib. Any ideas why?
Hello experts,
Please reference code below:
I do see the container defined above, I am not sure why I am getting this error:
ReferenceError: $ is not defined
var container = $('#galleryContainer');
Also, I am seeing the error below:
TypeError: a is undefined
...s,document,function(a,b ,c){!funct ion(a){a.m obile={}}( a),functio n(a,b){fun ction d.
any ideas why I am getting these errors?
Thank you for your help...
Regards,
Please reference code below:
<html>
<head>
<title>Test: blocks with dynamic heights</title>
<meta charset="ISO-8859-1" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- http://masonry.desandro.com/ -->
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.0/masonry.pkgd.min.js"></script>
<script>
var container = $('#galleryContainer');
//initialize
$container.masonry({
columnWidth: 200,
itemSelector: '.item'
});
</script>
<style>
.imgContainer{ float:left; padding: 5px; }
.footer{ clear:both; }
</style>
</head>
<body>
<!-- PAGE 1 begins -->
<div data-role="page" id="gallery" data-theme="a">
<!-- CONTENT -->
<div data-role="main">
<div id='galleryContainer'>
<div class='imgContainer'>
<div><a href='#'><img src="#" style="background-color:blue;width:300px;height:300px"></a></div>
</div>
<div class='imgContainer'>
<div><a href='#'><img src="#" style="background-color:yellow;width:300px;height:600px"></a></div>
</div>
<div class='imgContainer'>
<div><a href='#'><img src="#" style="background-color:red;width:300px;height:600px"></a></div>
</div>
</div>
</div>
<!-- FOOTER -->
<div data-role="footer" class="footer">
<div >footer</div>
</div>
</div>
<!-- PAGE 1 ENDS -->
</body>
I do see the container defined above, I am not sure why I am getting this error:
ReferenceError: $ is not defined
var container = $('#galleryContainer');
Also, I am seeing the error below:
TypeError: a is undefined
...s,document,function(a,b
any ideas why I am getting these errors?
Thank you for your help...
Regards,
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER