Mootools conflict between template and image popups
Posted: 15 Apr 2011, 07:10
I realize this is an issue with my template but I wanted to see if anyone had any ideas here because I am not hopeful the template author will do anything about it and I know you guys are very smart. Thanks in advance for any assistance.
Using Joomla 1.6 and the latest PhocaGallery. The template I am using has large image slider that seems to be using mootools for its functionality. From what I can determine, the template is calling its own mootools.js in its directory and causing the gallery to not work properly. Specifically the image popups (slimbox, etc.). If I remove the following line from the template's index.php file, the gallery works fine but the image slider stops working:
I have tried updating the index.php to point to joomla's mootools, but it seems the image slider only works with the mootools version included with it. I believe its version 1.12. My assumption is that the latest Mootools included with Joomla (1.3?) does not support some of the calls being made by the code in the template.
Here is the <head> section of my template's index.php:
If there are any suggestions at all you can make for changes to PhocaGallery or this template so they can play nice together, I will be extremely grateful. I have been searching these forums and google for hours and I'm at a lose.
Thank you.
Using Joomla 1.6 and the latest PhocaGallery. The template I am using has large image slider that seems to be using mootools for its functionality. From what I can determine, the template is calling its own mootools.js in its directory and causing the gallery to not work properly. Specifically the image popups (slimbox, etc.). If I remove the following line from the template's index.php file, the gallery works fine but the image slider stops working:
Code: Select all
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/mootools.js"></script>Here is the <head> section of my template's index.php:
Code: Select all
<jdoc:include type="head" />
<?php JHTML::_('behavior.framework', true);
$app = JFactory::getApplication();
$templateparams = $app->getTemplate(true)->params;
$csite_name = $app->getCfg('sitename');
?>
<?php //setting slide fading
$interval= $this->params->get("interval", "3000");
$autoplay= $this->params->get("autoplay", 1);
$duration= $this->params->get("duration", "500");
?>
<?php #main width#
$mod_left = $this->countModules( 'left' );
if ( $mod_left ) { $width = '';
} else { $width = '-full';
}
?>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/amadeon/css/superfish.css" type="text/css" media="all" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/amadeon/css/tdefaut.css" type="text/css" media="all" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/amadeon/css/box.css" type="text/css" media="all" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/amadeon/css/joomlastyle.css" type="text/css" media="all" />
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/mootools.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/script.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/scroll.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/cufon-yui.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/cufon-replace.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/js/Harvest_500.font.js"></script>
<script type="text/javascript" src="templates/<?php echo $this->template ?>/slideur/_class.noobSlide.js"></script>
<link rel="icon" type="image/gif" href="<?php echo $this->baseurl; ?>/templates/<?php echo $this->template; ?>/favicon.ico" />
<script type="text/javascript">
window.addEvent('domready', function() {
SqueezeBox.initialize({});
$$('a.modal').each(function(el) {
el.addEvent('click', function(e) {
new Event(e).stop();
SqueezeBox.fromElement(el);
});
});
});
</script>
<script type="text/javascript">
window.addEvent('domready',function(){
var hs1 = new noobSlide({
box: $('joomscontbox1'),
items:[1,2,3],
size: 865,
autoPlay:<?php echo $autoplay ?>, // true,
interval:<?php echo $interval ?>, // 3000,
fxOptions: {
duration:<?php echo $duration ?>, // 500,
transition: Fx.Transitions.Sine.easeOut,
wait: false
},
buttons: {
previous: $('prev1'),
next: $('next1')
}
});
});
</script>Thank you.
