in pure HTML, jQuery lightbox gallery is perfect running with animation,
while I’ve customize in Cake,…the picture is shown, but the lightbox animation is not work.
I’m linking css gallery lighbtox inside tag head
<?php
echo $this->Html->css('Sutinem.lsb.css');
echo $this->Html->css('Sutinem.owl.carousel.css');
echo $this->Html->css('Sutinem.owl.theme.css');
echo $this->Html->css('Sutinem.style.css');
?>
below some code picture gallery inside tag div
<div class="col-sm-4 col-xs-4 agile_gallery_grid">
<div class="w3ls_gallery_grid">
<?php
echo $this->Html->link(
$this->Html->image('Sutinem.g4.jpg',$klas_img,$fulb).
$this->Html->tag('div','',array('class' => 'agileinfo_content_wrap')).
$this->Html->tag('div','',array('class' => 'agileits_content')).
$this->Html->tag('h3','Burger').
$this->Html->tag('p','Ne nam facilisis adolescens faucibus.'),
'/img/g4.jpg',array('class' => 'lsb-preview wthree_p_grid', 'data-lsb-group' => 'header', 'escape' => false));
?>
</div>
</div>
next I call javascript gallery lightbox in the end tag body
<body>
<!-- jarallax -->
<?php echo $this->Html->script('Sutinem.jarallax.js'); ?>
<script type="text/javascript">
/* init Jarallax */
$('.jarallax').jarallax({
speed: 0.5,
imgWidth: 1366,
imgHeight: 768
})
</script>
<!-- //jarallax -->
<!-- gallery-lightbox -->
<?php echo $this->Html->script('Sutinem.lsb.min.js'); ?>
<script>
$(window).load(function() {
$.fn.lightspeedBox();
});
</script>
<!-- //gallery-lightbox -->
<!-- owl carousel -->
<?php echo $this->Html->script('Sutinem.carousel.js'); ?>
<script>
$(document).ready(function() {
$("#owl-demo").owlCarousel({
autoPlay: 3000, //Set AutoPlay to 3 seconds
autoPlay:true,
items : 3,
itemsDesktop : [991,2],
itemsDesktopSmall : [414,4]
});
});
</script>
<!-- //owl carousel -->
<?php echo $this->Html->script('Sutinem.bootstrap.js'); ?>
</body>
some file javascript and css gallery lightbox that I’ve most view and learning, here
<?php
echo $this->Html->css('Sutinem.lsb.css');
echo $this->Html->css('Sutinem.owl.carousel.css');
echo $this->Html->css('Sutinem.owl.theme.css');
echo $this->Html->script('Sutinem.jarallax.js');
echo $this->Html->script('Sutinem.lsb.min.js');
echo $this->Html->script('Sutinem.carousel.js');
?>
inside file jarallax.js
Jarallax.prototype.initImg = function() {
var _this = this;
// get image src
if(_this.image.src === null) {
_this.image.src = _this.$item.css('background-image').replace(/^url\(['"]?/g,'').replace(/['"]?\)$/g,'');
}
if(!_this.image.src || _this.image.src === 'none') {
return false;
}
return true;
}
the result generate code
$klas_img = ['class' => 'img-responsive'];
$fulb = ['fullBase' => true];
echo $this->Html->link(
$this->Html->image('Sutinem.g6.jpg',$klas_img,$fulb);
'/img/g2.jpg',array('class' => 'lsb-preview wthree_p_grid', 'data-lsb-group' => 'header', 'escape' => false));
are not synching with the jQuery files generate tag img, look for tag
source of <img>
tha’s some error, why animation gallery lightbox not working,
might some master of CakePHP could give the best ideas,

thanx