CODEWITHSUNDEEP
javascriptphptemplatesjoomla
user3931028
user3931028

Reputation: 35

Custom JavaScript not working in Joomla 3 template

i have problem with including javascript in joomla 3 template code. I am trying to create slider menu with http://9bitstudios.github.io/flexisel/. Outside of joomla with only html and java code, menu works great. But when i try to implement into joomla template i cant get it working.

My template code:

<?php 
defined( '_JEXEC' ) or die( 'Restricted access' );
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" 
   xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
    <jdoc:include type="head" />
    <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/reset.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/style.css" type="text/css" />



    <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/flexisel.css" type="text/css" />
    <?php
    JHtml::_('jquery.framework');
    ?>
    <script type="text/javascript" src="templates/<?php echo $this->template ?>/js/jquery.flexisel.js"></script>
    <script type="text/javascript" charset="utf-8">
        $(window).load(function() {
            $("#flexiselDemo1").flexisel();
        });
    </script>




</head>
<body>

    <div id="page">
        <div id="head">
            <a href="http://www.vossp.cz" class="logo">VOSSP</a>
        </div>
        <div id="main-menu">
            <jdoc:include type="modules" name="main-menu" /> 
        </div>
        <div id="footer">
        </div>
    </div>

</body>
</html>

I tryed using of $document->addScriptDeclaration and $document->addScript, from http://docs.joomla.org/Adding_JavaScript, but no change.

Upvotes: 0

Views: 1300

Answers (1)

Lodder
Lodder

Reputation: 19733

You are importing jQuery in noConflict mode, so try changing this:

$(window).load(function() {
    $("#flexiselDemo1").flexisel();
});

to this:

jQuery(document).ready(function($) {
    $("#flexiselDemo1").flexisel();
});

Note: go back to using JHtml::_('jquery.framework');

Upvotes: 1

Related Questions