vb.org Archive
Page 1 of 2 1 2
Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   Modification Graveyard (https://vborg.vbsupport.ru/forumdisplay.php?f=224)
-   -   Miscellaneous Hacks - Sweet Menu (https://vborg.vbsupport.ru/showthread.php?t=297901)

Black Snow 05-06-2013 10:00 PM
Sweet Menu
 
Sweet Menu takes an ordinary unordered list of links and makes it a sweet looking menu. It does this by utilizing jQuery and it?s plugin system. Simply include the jQuery library, the Sweet Menu plugin, and make a simple jQuery call and you are on your way to a sweet looking menu!

Installation

1. Upload the files from the attached zip file in your forum root.

2. Go to AdminCp > Styles & Templates > Common Templates

Add this to the very bottom of your HEADER template:
Code:
                <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="jquery.easing.js"></script>
        <script type="text/javascript" src="jquery.sweet-menu-1.0.js"></script>

                <script type="text/javascript">
                        $(document).ready(function(){
                               
                                $('#exampleMenu').sweetMenu({
                                        top: 200,
                                        padding: 8,
                                        iconSize: 40,
                                        easing: 'easeOutBounce',
                                        duration: 500,
                                        icons: [
                                                'images/home.png',
                                                'images/comments.png',
                                                'images/red_heart.png',
                                                'images/male_user.png',
                                                'images/yellow_mail.png',
                                                'images/computer.png'
                                        ]
                                });
                        });
                </script>

      <style type="text/css">
               
            .sweetMenuAnchor{
                                border-top: 1px solid #ffffff;
                                border-right: 1px solid #ffffff;
                                border-bottom: 1px solid #ffffff;
                                border-top-right-radius: 4px;
                                -moz-border-radius-topright: 4px;
                                border-bottom-right-radius: 4px;
                                -moz-border-radius-bottomright: 4px;
                                color: #0071bb;
                                font-size: 24px;
                                font-weight: bold;
                                text-align: right;
                                text-transform: uppercase;
                                font-family: arial;
                                text-decoration: none;
                                background-color: #888888;
                                opacity: 0.6;
                                z-index: 9999;
                        }

                        .sweetMenuAnchor span{
                                display: block;
                                padding-top: 10px;
                        }
        </style>


                <ul id="exampleMenu">
            <li><a href="YOUR_LINK">Home</a></li>
            <li><a href="YOUR_LINK">Blog</a></li>
            <li><a href="YOUR_LINK">CMS</a></li>
            <li><a href="YOUR_LINK">Hire Me</a></li>
            <li><a href="YOUR_LINK">Contact</a></li>
            <li><a href="YOUR_LINK">My Apps</a></li>
        </ul>

3. Make sure you replace YOUR_LINK with actual links on your forum. You can set them to external links too if you wish.

Please Note that help is only given for members who have Marked as Installed.

Brandon Sheley 05-07-2013 12:19 PM
screenshot or demo?

Black Snow 05-07-2013 12:22 PM
Demo is included in the file. open index.html

You don't see how it works with a screenshot.

faisaly.com 05-07-2013 07:03 PM
Works ok but i want on the right side not left...

Black Snow 05-07-2013 07:43 PM
Please Note that help is only given for members who have Marked as Installed.

Spangle 05-07-2013 07:55 PM
Quote:
Originally Posted by Black Snow (Post 2420581)
Please Note that help is only given for members who have Marked as Installed.
Hmm would like a couple of questions answered before installing

The tabs are a bit low down the page, can they be moved higher ?

The tabs are way too big, can they be made smaller ?

Will they inherit theme colours ?

faisaly.com 05-07-2013 08:18 PM
marked installed, but needed answer before I installed it cuz i wanted to know about position...

Black Snow 05-07-2013 09:11 PM
Quote:
Originally Posted by Spangle (Post 2420584)
The tabs are a bit low down the page, can they be moved higher ?
Yes, find:
Code:
top: 200,
And change to 100 or whatever you want to get the higher or lower down.

Quote:
Originally Posted by Spangle (Post 2420584)
The tabs are way too big, can they be made smaller ?
It requires some additional modification to reduce the size height wise if this is what you want to make smaller. I will post that later.

Quote:
Originally Posted by Spangle (Post 2420584)
Will they inherit theme colours ?
As of now, no. Perhaps in a future update.

Black Snow 05-07-2013 09:14 PM
Quote:
Originally Posted by faisaly.com (Post 2420574)
Works ok but i want on the right side not left...
This will require a lot of code changes. I will post another version soon.

Spangle 05-08-2013 02:58 PM
Quote:
Originally Posted by Black Snow (Post 2420593)
Yes, find:
Code:
top: 200,
And change to 100 or whatever you want to get the higher or lower down.


It requires some additional modification to reduce the size height wise if this is what you want to make smaller. I will post that later.


As of now, no. Perhaps in a future update.
Thanks for the quick reply, I will keep an eye on this one to see if they are made smaller and can inherit theme colours


All times are GMT. The time now is 04:02 PM.
Page 1 of 2 1 2
Show 40 post(s) from this thread on one page

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01376 seconds
  • Memory Usage 1,756KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (3)bbcode_code_printable
  • (6)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 
Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete