Advanced Search

Results 1 to 5 of 5

Thread: accordion content problem

  1. #1
    Join Date
    Jan 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default accordion content problem

    Hi there! i have been trying to implement the accordion content of dynamic drive with no luck until now.
    Im not sure what I'm doing wrong, or what I'm missing. My page is a wordpress theme maybe that has something to do with it??

    i would appreciate any help to make it work!! or any advice
    thanks in advance to everyone out there

    Ale
    http://bitacoraurbana.com/
    Last edited by alereds; 01-13-2012 at 03:27 PM.

  2. #2
    Join Date
    Jul 2009
    Location
    Binus University
    Posts
    452
    Thanks
    76
    Thanked 21 Times in 21 Posts

    Default

    I try to make the same menu like you did, it work no problem:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    
    <script type="text/javascript" src="ddaccordion.js">
    
    /***********************************************
    * Accordion Content script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
    * This notice must stay intact for legal use
    ***********************************************/
    
    </script>
    
    
    <style type="text/css">
    .mypets{ /*header of 1st demo*/
    cursor: hand;
    cursor: pointer;
    padding: 2px 5px;
    border: 1px solid gray;
    background: #E1E1E1;
    }
    
    .openpet{ /*class added to contents of 1st demo when they are open*/
    background: yellow;
    }
    }
    
    </style>
    
    <script type="text/javascript">
    
    //Initialize first demo:
    ddaccordion.init({
    	headerclass: "expandable", //Shared CSS class name of headers group
    	contentclass: "categoryitems", //Shared CSS class name of contents group
    	revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
    	mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
    	collapseprev: true, //Collapse previous content (so only one open at any time)? true/false 
    	defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content.
    	onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
    	animatedefault: false, //Should contents open by default be animated into view?
    	persiststate: true, //persist state of opened contents within browser session?
    	toggleclass: ["", ""], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
    	togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively  ["position", "html1", "html2"] (see docs)
    	animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
    	oninit:function(expandedindices){ //custom code to run when headers have initalized
    		//do nothing
    	},
    	onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
    		//do nothing
    	}
    })
    </script>
    </head>
    
    <body>
    <h3 class="menuheader expandable">About me</h3>
    <ul class="categoryitems" style="margin-bottom:-12px; padding-top:15px;">
    <li><a href="http://www.">CV Download</a></li>
    </ul>
    
    <h3 class="menuheader expandable">Projects</h3>
    <ul class="categoryitems" style="margin-bottom:-12px; padding-top:15px;">
    <li><a href="http://www." >All </a></li>
    <li><a href="http://www.">Housing</a></li>
    </ul>
    
    <h3 class="menuheader expandable">Stuff i like</h3>
    <ul class="categoryitems" style="margin-bottom:-12px; padding-top:15px;">
    <li><a href="http://www." >Photo</a></li>
    <li><a href="http://www.">Design</a></li>
    
    </ul>
    
    <h3 class="menuheader expandable"><a href="http://bitacoraurbana.com/?page_id=171" >My Blog</a></h3>
    </body>
    </html>
    _____________________

    David Demetrius // davejob
    _____________________

  3. #3
    Join Date
    Jan 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank you David, i tried copying all the code from the DDPage again, and nothing...
    i guess it must be something to do with wordpress, but thanks anyway!!

  4. #4
    Join Date
    Aug 2004
    Posts
    9,864
    Thanks
    3
    Thanked 960 Times in 949 Posts
    Blog Entries
    15

    Default

    There may be other issues, but looking at your page, your reference to ddaccordion.js in the HEAD of your page is broken. If I try and load bitacoraurbana.com/ddaccordion.js it doesn't work.

    Make sure to upload ddaccordion.js to the root directory of your site per the reference's path.
    DD Admin

  5. The Following User Says Thank You to ddadmin For This Useful Post:

    alereds (01-13-2012)

  6. #5
    Join Date
    Jan 2012
    Posts
    3
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Great admin! i had the .js file on my theme root, but i copied to the wordpress root and now is functioning! thanks

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •