...

View Full Version : Sidebar plus Dock help please



Ubertreffen
07-24-2007, 09:52 AM
Please I really need help with doing these two little things, for those who know how to do this please help me out I really need help to do it please.

Hi I am using this theme here for my site : http://www.ndesign-studio.com/demo/wordpress/

Now I need help editing two things:

1- As you can see at the bottom of the theme it has a dock, I need to know how to put this in(and when you scroll over it it gets bigger), see the attached pic of what I mean.

http://img524.imageshack.us/img524/3481/65411669hl4.th.png (http://img524.imageshack.us/my.php?image=65411669hl4.png)

Here is the footer code if someone could add to it to help me please:
------------------------------------------------
<hr class="hidden" />

</div><!--/wrapper -->




</div><!--/page -->

<?php wp_footer(); ?>
</body>
</html>

-----------------------------------------------------
2. This is most important, I need to get rid of the sidemenu that they are like now, and have the sidemenus like the one on apples site here, http://www.apple.com/support/ , where when your mouse scrolls over it it moves to the next menu, see the attached pic of what I mean.

http://img411.imageshack.us/img411/2596/68942046bn5.th.png (http://img411.imageshack.us/my.php?image=68942046bn5.png)

Here is the sidebar code:
--------------------------------------
PHP Code:
<div class="dbx-group" id="sidebar">

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>

<!--sidebox start -->
<div id="categories" class="dbx-box">
<h3 class="dbx-handle"><?php _e('Categories'); ?></h3>
<div class="dbx-content">
<ul>
<?php wp_list_cats('sort_column=name&optioncount=1&hierarchical=0'); ?>
</ul>
</div>
</div>
<!--sidebox end -->

<!--sidebox start -->
<div id="archives" class="dbx-box">
<h3 class="dbx-handle"><?php _e('Archives'); ?></h3>
<div class="dbx-content">
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
</div>
</div>
<!--sidebox end -->

<!--sidebox start -->
<div id="links" class="dbx-box">
<h3 class="dbx-handle"><?php _e('Links'); ?></h3>
<div class="dbx-content">
<ul>
<?php get_links('-1', '<li>', '</li>', '<br />', FALSE, 'id', FALSE, FALSE, -1, FALSE); ?>
</ul>
</div>
</div>
<!--sidebox end -->

<!--sidebox start -->
<div id="meta" class="dbx-box">
<h3 class="dbx-handle">Meta</h3>
<div class="dbx-content">
<ul>
<li class="rss"><a href="<?php bloginfo('rss2_url'); ?>">Entries (RSS)</a></li>
<li class="rss"><a href="<?php bloginfo('comments_rss2_url'); ?>">Comments (RSS)</a></li>
<li class="wordpress"><a href="http://www.wordpress.org" title="Powered by WordPress">WordPress</a></li>
<li class="login"><?php wp_loginout(); ?></li>
</ul>
</div>
</div>
<!--sidebox end -->

<?php endif; ?>

</div><!--/sidebar -->

------------------------------------------------------
Please I really need help on how to do these things, please if anyone could help me it would be very appreciated, thanks in advance.

timgolding
07-24-2007, 01:48 PM
1. to achieve this i would perhaps have a JS toggler that when you you hold your mouse over the the dock it hides the existing dock and replaces it with a bigger one. Then if you want the individual items to increase in size possibly use an image swap function or something. All of which can be achieved with Java Script. I don't know the exact effect you are trying to achieve but i think JS would be your best bet.

2. This kind of thing can be achieved with CSS. Google for expandable menus. drop down menus etc. You also achieve this effect with a toggler.

The problem is both methods may rely on JS and you need to make alternatives for users who don't have JS.

garydarling
07-24-2007, 04:31 PM
Try this for your image resizing question:

http://www.nsftools.com/tips/ImageResize.htm

For your sidebar issue you have a lot of work to do. Apple uses a javascript called drawers.js that is not annotated with instructions, nor is it available in the public domain.

You could likely copy it and modify it for your needs if you are familiar with javascript programming (I am not), or you could scour the many script sites out there for an experienced programmer to assist you with it.

Use Firefox and the free add-ons Firebug, JSView, and Web Developer Toolbar to dissect the sites you find with interesting effects, then practice at home.:(



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum