ThemeShaper Forums » Thematic

[closed]

using CSS Mac Dock Menu on Thematic

(6 posts)
  • Started 4 years ago by elorenishii386
  • Latest reply from Johnetta
  • This topic is not resolved
  1. elorenishii386
    Member

    I've come across the CSS Mac Dock Menu that utilizes jQuery. However, I have not been able to make it work on Thematic. I've integrated the CSS into my style sheet and placed the js into the scripts folder. I don't know what I am doing wrong or need to do in order to make this work.

    http://www.ndesign-studio.com/blog/mac/css-dock-menu

    I've placed this code into the header.php

    <script type="text/javascript" src="<?php echo get_bloginfo('template_directory'); ?>/library/scripts/jquery.js"></script>
    <script type="text/javascript" src="<?php echo get_bloginfo('template_directory'); ?>/library/scripts/interface.js"></script>

    <!--[if lt IE 7]>
    <style type="text/css">
    .dock img { behavior: url(<?php echo get_bloginfo('template_directory'); ?>/iepngfix.htc) }
    </style>
    <![endif]-->

    and this is my code:

    <div class="dock" id="dock2">
    <div class="dock-container2">
    <span>RSS</span><img src="<?php echo get_bloginfo('template_directory'); ?>/images/rss.png"alt="RSS" />
    <span>Twitter</span><img src="<?php echo get_bloginfo('template_directory'); ?>/images/twitter.png" alt="Twitter" />
    <span>Facebook</span><img src="<?php echo get_bloginfo('template_directory'); ?>/images/facebook.png" alt="Facebook" />
    </div>
    </div>

    <!--dock menu JS options -->
    <script type="text/javascript">
    $(document).ready(
    function()
    {
    $('#dock2').Fisheye(
    {
    maxWidth: 60,
    items: 'a',
    itemsText: 'span',
    container: '.dock-container2',
    itemWidth: 40,
    proximity: 80,
    alignment : 'left',
    valign: 'bottom',
    halign : 'center'
    }
    )
    }
    );
    </script>

    Posted 4 years ago #
  2. rachit
    Member

    how to use Mac css ?

    Posted 3 years ago #
  3. Hi,

    I would suggest you read (and bookmark) this thread: http://forums.themeshaper.com/topic/jquery-in-thematic-demystified

    Posted 3 years ago #
  4. placed the js into the scripts folder

    but did you call it? is it loading on the page? see the post i wrote that joperron linked to.

    I've placed this code into the header.php

    danger will robinson! editing the thematic core defeats the whole purpose of child theming and all your edits would be lost if you ever upgraded. again, read my above thread... it should get you started. you can come back here w/ any further questions.

    also- in case you are totally new to child themes: http://www.catswhocode.com/blog/wordpress-how-to-easily-create-a-thematic-child-theme

    Posted 3 years ago #
  5. Just used this code on my site, works great. Jquery javascript is the best. Took my dull marketing, design site and it now looks like the mac OSX operating system. Super flexible.

    Here is an example of my site using the code.

    Visizzle - Branding - Marketing

    Posted 3 years ago #
  6. Johnetta
    Member

    Jquery javascript is the best. Took my dull marketing, design site and it now looks like the mac OSX operating system. Super flexible.

    --------------------

    leather ipad 2 case ipad 2 case ipad 2 accessories

    Posted 2 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.