radexon
17-03-2014, 19:07
Mam problem z szablonem.
Mianowicie mam w miejscu gdzie treść wyświetla wstawiony scrollbar a menu z lewej na stałe ustawione.
Problem bo nie działa mi żadna galeria lub lightbox wstawiony w tym szablonie. W czym może być problem?
Kod wygląda tak. Domyślam się, że konflikt JQUERY jest. Pytanie jak go rozwiązać.
<?php defined('_JEXEC') or die;
$app = JFactory::getApplication();
?>
<!doctype html>
<html><head>
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/jquery.mCustomScrollbar.css" rel="stylesheet" />
<!-- Google CDN jQuery with fallback to local -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
**********!window.jQuery && document.write(unescape('%3Cscript src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/minified/jquery-1.9.1.min.js"%3E%3C/script%3E'))</script>
<!-- custom scrollbars plugin -->
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery.mCustomScrollbar.concat.min.js"></script>
**********
(function($){
$(window).load(function(){
$("#content_1").mCustomScrollbar({
scrollButtons:{
enable:true
}
});
//ajax demo fn
$("a[rel='load-content']").click(function(e){
e.preventDefault();
var $this=$(this),
url=$this.attr("href");
$this.addClass("loading");
$.get(url,function(data){
$this.removeClass("loading");
$("#content_1 .mCSB_container").html(data); //load new content inside .mCSB_container
$("#content_1").mCustomScrollbar("update"); //update scrollbar according to newly loaded content
$("#content_1").mCustomScrollbar("scrollTo","top",{scrollInertia:200}); //scroll to top
});
});
$("a[rel='append-content']").click(function(e){
e.preventDefault();
var $this=$(this),
url=$this.attr("href");
$this.addClass("loading");
$.get(url,function(data){
$this.removeClass("loading");
$("#content_1 .mCSB_container").append(data); //append new content inside .mCSB_container
$("#content_1").mCustomScrollbar("update"); //update scrollbar according to newly appended content
$("#content_1").mCustomScrollbar("scrollTo","h2:last",{scrollInertia:2500,scrollEasing:"easeInOutQuad"}); //scroll to appended content
});
});
});
})(jQuery);
</script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery-bgstretcher-3.1.2.min.js"></script>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/bgstretcher.css">
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css">
</head>
<!--[if IE]>
<style>
#lewa {
height:100%;
width:100%;
background-color: #333;
display: inline-table;
overflow:hidden;
}
.content {
overflow:auto;
-moz-opacity: 0.84;
opacity: 0.84;
padding:1%;
width:100%;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=84);
background-color: #333;
position: relative;
}
#content_1 {
max-height:88%;
position: absolute;
}
</style>
<![endif]-->
<body>
<table width="103%" height="100%">
<tr height="100%">
<td id="lewa">
<table height="100%" width="100%">
<tr >
<td id="left" valign="top">
<nav>
<ul>
<jdoc:include type="modules" name="menu" style="xhtml" />
</ul>
</nav>
</td>
<td width="1%"></td>
<td id="right" valign="top" height="100%">
<div id="content_1" class="content">
<jdoc:include type="message" />
<jdoc:include type="component" />
</div>
</td>
</body>
</html>
Mianowicie mam w miejscu gdzie treść wyświetla wstawiony scrollbar a menu z lewej na stałe ustawione.
Problem bo nie działa mi żadna galeria lub lightbox wstawiony w tym szablonie. W czym może być problem?
Kod wygląda tak. Domyślam się, że konflikt JQUERY jest. Pytanie jak go rozwiązać.
<?php defined('_JEXEC') or die;
$app = JFactory::getApplication();
?>
<!doctype html>
<html><head>
<link href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/jquery.mCustomScrollbar.css" rel="stylesheet" />
<!-- Google CDN jQuery with fallback to local -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
**********!window.jQuery && document.write(unescape('%3Cscript src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/minified/jquery-1.9.1.min.js"%3E%3C/script%3E'))</script>
<!-- custom scrollbars plugin -->
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery.mCustomScrollbar.concat.min.js"></script>
**********
(function($){
$(window).load(function(){
$("#content_1").mCustomScrollbar({
scrollButtons:{
enable:true
}
});
//ajax demo fn
$("a[rel='load-content']").click(function(e){
e.preventDefault();
var $this=$(this),
url=$this.attr("href");
$this.addClass("loading");
$.get(url,function(data){
$this.removeClass("loading");
$("#content_1 .mCSB_container").html(data); //load new content inside .mCSB_container
$("#content_1").mCustomScrollbar("update"); //update scrollbar according to newly loaded content
$("#content_1").mCustomScrollbar("scrollTo","top",{scrollInertia:200}); //scroll to top
});
});
$("a[rel='append-content']").click(function(e){
e.preventDefault();
var $this=$(this),
url=$this.attr("href");
$this.addClass("loading");
$.get(url,function(data){
$this.removeClass("loading");
$("#content_1 .mCSB_container").append(data); //append new content inside .mCSB_container
$("#content_1").mCustomScrollbar("update"); //update scrollbar according to newly appended content
$("#content_1").mCustomScrollbar("scrollTo","h2:last",{scrollInertia:2500,scrollEasing:"easeInOutQuad"}); //scroll to appended content
});
});
});
})(jQuery);
</script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/jquery-bgstretcher-3.1.2.min.js"></script>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/bgstretcher.css">
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css">
</head>
<!--[if IE]>
<style>
#lewa {
height:100%;
width:100%;
background-color: #333;
display: inline-table;
overflow:hidden;
}
.content {
overflow:auto;
-moz-opacity: 0.84;
opacity: 0.84;
padding:1%;
width:100%;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=84);
background-color: #333;
position: relative;
}
#content_1 {
max-height:88%;
position: absolute;
}
</style>
<![endif]-->
<body>
<table width="103%" height="100%">
<tr height="100%">
<td id="lewa">
<table height="100%" width="100%">
<tr >
<td id="left" valign="top">
<nav>
<ul>
<jdoc:include type="modules" name="menu" style="xhtml" />
</ul>
</nav>
</td>
<td width="1%"></td>
<td id="right" valign="top" height="100%">
<div id="content_1" class="content">
<jdoc:include type="message" />
<jdoc:include type="component" />
</div>
</td>
</body>
</html>