Sweet Menu
Mod Version: 1.00, by Black Snow
This thread is in the Modification Graveyard.
| vB Version: 4.2.x | Rating:  (1 vote - 5.00 average) |
Installs: 11 |
| Released: 07 May 2013 | Last Update: Never | Downloads: 273 |
 Not Supported
 Template Edits
Additional Files
|
||
Sweet Menu takes an ordinary unordered list of links and makes it a sweet looking menu. It does this by utilizing jQuery and its 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:
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.
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.
Download
This modification cannot be downloaded.