Copy link to clipboard
Copied
Trying to incorporate the bxSlider, which the BC app "BC Gallery" is based on. (bxslider.com) and using it in conjunction with the BC Web App - to add the images and classify the images. All of it works properly as shown below.
HOWEVER... I built a template page in Muse. Then I selected my gallery page to use the template page. Once I do, the gallery quits functioning and puts the images in a list format down the page - with all images viewable.
I know it has something to do with the jquery. If I remove the Jquery from the head (without the template applied), the result is the same - images listed down the page and the gallery function doesn't work.
When I apply the page template, I get the error that the .ready(function) js isn't a functional script. (the part in bold below)
SCREEN CAPS show how it looks without the template applied and WITH the template applied to the page.
Anyone done this before... and live to tell the tales?
<!DOCTYPE html>
<html>
<head>
<title>My Custom Image Gallery</title>
<meta name="description" />
<!-- bxSlider CSS file -->
<link rel="stylesheet" href="/lib/jquery.bxslider.css" />
<!-- jQuery library (served from Google) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="/js/jquery.bxslider.js"></script>
<script src="/js/jquery.bxslider.min.js"></script>
<script>
$(document).ready(function(){
$('.bxslider').bxSlider({
mode: 'fade'
});
});
</script>
</head>
<body>
<div class="bx-wrapper">
<ul class="bxslider">
{module_webapps id="29027" filter="all"}
</ul>
</div>
</body>
</html>