Adding ZoZo Tabs (javavscript) to a block within Drupal 7

Josh Baldwin
Josh Baldwin used Ask the Experts™

i am trying to use ZoZo tabs within a block in Drupal 7. It states I needed to upload these files to my site which i done:

    ├── css/
    │   └── zozo.tabs.min.css
    ├── img/
    │   ├── z-tabs-icons.png (Mobile)
    │   └── loading-image.gif (AJAX)
    └── js/
        ├── jquery.min.js
        └── zozo.tabs.min.js

Then add the following to the head of the html which i have added to the html.tpl.php in my sites/all/theme/stig/templates folder since that is the theme I am using.
<link href="/css/zozo.tabs.min.css" rel="stylesheet">
<script src="/js/jquery.min.js"></script>
<script src="/js/zozo.tabs.min.js"></script>

then add the following to before the </body>:

jQuery(document).ready(function ($) {
        theme: "silver",      
        animation: {
            duration: 800,
            effects: "slideH"

I have added everything and it show up on the page when i view the source code and everything is linked. the div id is unique. Is there something I missing about drupal that is preventing this? Should I had the script using a different way?
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Distinguished Expert 2017

Maybe you have directory problem.Try with this:
<link href="./css/zozo.tabs.min.css" rel="stylesheet">
<script src="./js/jquery.min.js"></script>
<script src="./js/zozo.tabs.min.js"></script>

Open in new window

<link href="../css/zozo.tabs.min.css" rel="stylesheet">
<script src="../js/jquery.min.js"></script>
<script src="../js/zozo.tabs.min.js"></script>

Open in new window

Sorry for the delay. It wasn't a directory issue after all. I had to add The following lines to the '.info' file for my theme:

stylesheets[all][] = css/zozo.tabs.min.css
scripts[] = js/zozo.tabs.min.js
scripts[] = js/zozotabs.js

With the zozotabs.js being a new script file i made for the script that needed to be included on the page.

Thank you.


I tried the provided solution and did not work. Further independent research, provided a solution.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial