domingo, 5 de junio de 2011

menu deslizante para blogger 1 con jquery

bueno este es un menu muy bonito para agregarlo a blogger o a su pagina web
clic aqui para ver ejemplo


lo primero que deben hacer es en edicion html buscan la etiqueta

<head>

justo despues de esa etiqueta ponen el siguiente codigo

<!-- menu por andres2288 cabeza --> 

        <script type="text/javascript" src="http://www.tutorialjquery.com/scripts/menu/demo/jquery-1.4.2.min.js"></script>

        <script type="text/javascript" src="http://www.tutorialjquery.com/scripts/menu/demo/jquery.lksMenu.js"></script>

        <link rel="stylesheet" type="text/css" href="http://www.tutorialjquery.com/scripts/menu/demo/lksMenuSkin2.css" />

        <script>

        $('document').ready(function(){

            $('.menu').lksMenu();

        });

        </script>
 <!-- menu por andres2288 cabeza -->

luego elegimos donde queremos poner el menu puden ser en un gadget
ponemos el siguiente codigo para el menu

<!-- menu por andres2288 body --> 
<div class="menu">

        <div></div>

            <br/>



  <ul>

            <li>

                <a href="#">parte 1</a>

                <ul>

                    <li><a href="http://www.andresfelipe2288.blogspot.comI">mi blog</a></li>

                    <li><a href="#">Flash</a></li>

                    <li><a href="#">Prototype</a></li>

                    <li><a href="#">Mootools</a></li>

                </ul>

      </li>

            <li>

                <a href="#">parte 2</a>

                <ul>

                    <li><a href="#">Flickr</a></li>

                    <li><a href="#">Twitter</a></li>

                    <li><a href="#">Rating</a></li>

              </ul>

          </li>

            <li>

                <a href="#">parte 3</a>

                <ul>

                    <li><a href="#">Tutorial jQuery</a></li>

                    <li><a href="#">jsonp Examples</a></li>

                    <li><a href="#">Codigo Gratis</a></li>

                    <li><a href="#">Bug Base</a></li>

                </ul>

            </li>

            <li>

                <a href="#">parte 4</a>

                <ul>

                    <li><a href="#">Resolver Matrices</a></li>

                    <li><a href="#">Letras de Canciones</a></li>

                    <li><a href="#">Cheats Code</a></li>

                    <li><a href="#">Solving equations</a></li>

                </ul>

            </li>
 <li>

<a href="#">parte 5</a>

                <ul>

                    <li><a href="#">Resolver Matrices</a></li>

                    <li><a href="#">Letras de Canciones</a></li>

                    <li><a href="#">Cheats Code</a></li>

                    <li><a href="#">Solving equations</a></li>

                </ul>

            </li>
        </ul>

    </div>

<!-- menu por andres2288 body -->
y listo eso es todo cambian donde esta # por la url que quieran, si quieren agregar mas al menu solo deben agregar el siguiente codigo antes de las etiquetas</ul>

</div> finales
y despues de las etiquetas </ul>

</li> que son las del anterior menu

codigo

<li>

<a href="#">aqui ponagn el nombre que quieran</a>

                <ul>

                    <li><a href="#">Resolver Matrices</a></li>

                    <li><a href="#">Letras de Canciones</a></li>

                    <li><a href="#">Cheats Code</a></li>

                    <li><a href="#">Solving equations</a></li>

                </ul>

            </li>

y eso es todo

descargar el menu para implementarlo en su pagina web
clic aqui para descargarlo