Ads

Dinamix-FX-Slide-In Menu

On the internet browsing habits are indeed many benefits in the can as I post this time is the result of browsing and finally get a good tutorial in www.dynamicdrive.com.
This tutorial is given a name Dinamix-FX-Slide-In Menu. I will explain a little Dinamix FX Slide In Menu is a menu that is always hidden in the left side of the screen and is visible only if the menu bar and the mouse cursor is placed on the new menu bar menu that is in them will emerge, this menu is also unique because it is always follow movements to scroll up or down and is always on the left side of the screen.
If you are interested to make it please download the first code, click the article below:


DOWNLOAD CODE


If you have downloaded, extract used to use the software winrar or winzip because this file has extensi.zip. After the two files will appear that has the name ssm.js and ssmltems.js then upload the file but before you upload, you need to edit the file named ssmltems.js to replace the existing link with your own links.
To do edit the file follow the following ways:
right click on the file named ssmltems.js and select Open With and select Notepad, after the open will appear like the example code below :


<!--
/*
Configure menu styles below
NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors
*/
YOffset=150; // no quotes!!
XOffset=0;
staticYOffset=30; // no quotes!!
slideSpeed=20 // no quotes!!
waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
menuBGColor="black";
menuIsStatic="yes"; //this sets whether menu should stay static on the screen
menuWidth=150 ; // Must be a multiple of 10! no quotes!!
menuCols=2;
hdrFontFamily="verdana";
hdrFontSize="2";
hdrFontColor="white";
hdrBGColor="# 170088 ";
hdrAlign="left";
hdrVAlign="center";
hdrHeight="15";
linkFontFamily="Verdana";
linkFontSize="2";
linkBGColor="white";
linkOverBGColor="#FFFF99";
linkTarget="_top";
linkAlign="Left";
barBGColor="# 444444 ";
barFontFamily="Verdana";
barFontSize="2";
barFontColor="white";
barVAlign="center";
barWidth=20; // no quotes!!
barText="MAIN MENU"; // <IMG> tag supported. Put exact html for an image to show.
///////////////////////////
// ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header
ssmItems[0]=["Menu"] //create header
ssmItems[1]=["Home", "http://mpthrelyrics.blogspot.com", ""]
ssmItems[2]=["Free Games & Aplikasi", "http://download-4u-free.blogspot.com", "_new"]
ssmItems[3]=["Blog Tutorial", "http://tutorial-4u.blogspot.com", "_new"]
ssmItems[4]=["Download Template", "http://www.ziddu.com/download/8406670/Blackwhitemusictemplate.zip.html", "_new"]
buildMenu();
//-->


In fact there are many other menus that you should change according to your liking there are less than 12 menu because I accidentally cut too much. I understand the above code when I really just try to set the display just like the big font, font color, text color and background. You should own because it is easy to learn and while you practice. In writing Main Menu, Home and others that I bolded above may change as you wish.
Furthermore, the file you just uploaded to storage files like google page creator and do not forget to note/copy the files to the url address. To enter into the template code please follow the following guidelines:

1. Login to Blogger.com. 2. Click Layout.
3. Click on Edit Html.
4. Copy paste the following code above the code </head>



<style type="text/css">
<!--
A.ssmItems:link<
color:black;
text-decoration:none;
>
A.ssmItems:hover<
color:black;
text-decoration:none;
>
A.ssmItems:active<
color:black;
text-decoration:none;
>
A.ssmItems:visited<
color:black;
text-decoration:none;
>
//-->
</style>
<SCRIPT SRC="http://sites.google.com/site/myscriptku/script/ssm.js" language="JavaScript1.2">
//Dynamic-FX slide in menu v6.5 (By maXimus, http://maximus.ravecore.com/)
//Updated July 8 th, 03' for doctype bug
//For full source, and 100's more DHTML scripts, visit http://www.dynamicdrive.com
</SCRIPT>
<SCRIPT SRC="http://sites.google.com/site/myscriptku/script/ssmItems.js" language="JavaScript1.2">
</SCRIPT>


My code in bold please change it with your property that had been uploaded.


5. Click Save Template and see the results.
6. Done and good luck!



If you want to read this article in the Indonesian language, please click here: