index.html



    <!DOCTYPE HTML>         <!-- Index, webpage, JardinAnatolia -->
    <html lang="es">
            <!-- Header -->
            <head>
                    <!-- Codificacion de Caracteres Estandar -->
                    <meta charset = "utf-8" />
                    <meta name="viewport" content="width=device-width, initial-scale=1.0">
                    <!-- KeyWords -->
                    <meta name="keywords" content="jardín infantil, anatolia, infantil, preescolar, educación">
                    <!-- Description -->
                    <meta name="description" content="Main Page Jardín Anatolia">
                    <meta name="author" content="FundacionNenufar">
                    <!-- Title -->
                    <title>Principal - Jardín Infantil Anatolia</title>
                    <!-- StyleSheet -->
                    <link rel="stylesheet" type="text/css" href="stylesheet.css" >
                    <!-- Short Cut Icon -->
                    <link rel="shortcut icon" type="image/ico" href="images/resources/favicon.ico">
                    <!-- Script para compatibilidad con IE 9 -->
                    <!-- <[if lt IE 9]>
                            <script src=”http://HTML5shim.googlecode.com/svn/trunk/HTML5.js”>
                            </script>
                    <![endif]-->
                    <!-- Script default  Google JQuery -->
                    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
                    <!-- Script default  Google JQuery -->
                    <script type="text/javascript" src="scripts/jquery-1.9.1.js"></script>
                    <!-- Tabbed Box Script -->
                    <script type="text/javascript" src="scripts/tabbedboxscript.js"></script>
                    <script type="text/javascript" src="scripts/slider.js"></script>
                    <script type="text/javascript">
                            var time = 2;
                            var speed = 1;
                            var sideposition = "v";
                            $(document).ready(wideSlider);
                    </script>
            </head>
            <!-- Body -->
            <body>

                <!-- Header -->
                <header>
                    <!-- Garden's Logo -->
                    <div class="logo">
                            <figure>
                            <img src="images/resources/logo.gif" alt = "Jardín Anatolia Logo" id = "logoan" title = "Jardín Anatolia Logo"/>
                            <figcaption>
                                <em>“Educar a nuestros niños y niñas en valores humanos universales para construir una sociedad sana y enfrentar los retos del mundo globalizado”</em>
                            </figcaption>
                        </figure>
                    </div>
                    <!-- Side Logo's Menu -->
                    <div class="sidelogo">
                            <!-- Follow Us and Lang Chooser -->
                            <div class="sideuplogo">
                            <!-- Follow Us -->
                              <section class = "followus">
                                <span>Siguenos</span>
                                <a href="http://facebook.com/freewebsitetemplates" target="_blank" class="facebook">Facebook</a>
                                <a href="http://webmail.jardinanatolia.com" class="subscribe">Webmail</a>
                                <a href="http://twitter.com/fwtemplates" target="_blank" class="twitter">Twitter</a>
                              </section>
                            <!-- Lang Chooser -->
                            <section class="lang-chooser">
                                <section style="text-align: right;">
                                    <a href="?locale=tr"><img src="images/flags/Colombia-Flag-32.png" title="En Español" alt="En Español"/></a>
                                    <a href="?locale=tr"><img src="images/flags/Turkey-Flag-32.png" title="Türkçe'de" alt="Türkçe'de"/></a>
                                    <a href="?locale=en"><img src="images/flags/United-Kingdom-flag-32.png" title="In English" alt="In English"/></a>
                                </section>
                            </section>
                        </div>
                        <!-- Slider Banner -->
                        <div id="sliderbannerlogo">
                            <div id="contentslider">
                              <div id="bigimages" style="color: violet">
                                    <div>
                                      <a href="javascript:;"><img src="images/banners/banner1.jpg" alt="Jardin Anatolia" /></a></div>
                                  <div>
                                      <a href="javascript:;"><img src="images/banners/banner2.jpg" alt="Jardin Anatolia" /></a></div>
                                    <div>
                                      <a href="javascript:;"><img src="images/banners/banner3.jpg" alt="Jardin Anatolia" /></a></div>
                                      <div>
                                      <a href="javascript:;"><img src="images/banners/banner4.jpg" alt="Jardin Anatolia" /></a></div>
                                      <div>
                                      <a href="javascript:;"><img src="images/banners/banner5.jpg" alt="Jardin Anatolia" /></a></div>
                              </div>
                            </div>
                        </div>
                        <!-- Tabbed Box Menu -->
                        <div class="tabbedboxmenu">
                            <section class="tabs">
                                <!-- Tabs -->
                  <input id="tab-1" type="radio" name="radio-set" class="tab-selector-1" checked="checked" onclick="changeContent(1)" />
                                    <label for="tab-1" class="tab-label-1" onclick="changeContent(1)">Inicio</label>

                        <input id="tab-2" type="radio" name="radio-set" class="tab-selector-2" onclick="changeContent(2)" />
                                    <label for="tab-2" class="tab-label-2" onclick="changeContent(2)">Quienes Somos</label>

                        <input id="tab-3" type="radio" name="radio-set" class="tab-selector-3" onclick="changeContent(3)" />
                                    <label for="tab-3" class="tab-label-3" onclick="changeContent(3)">Admisiones</label>

                        <input id="tab-4" type="radio" name="radio-set" class="tab-selector-4" onclick="changeContent(4)" />
                                    <label for="tab-4" class="tab-label-4" onclick="changeContent(4)">Proyecto Institucional</label>

                    <input id="tab-5" type="radio" name="radio-set" class="tab-selector-5" onclick="changeContent(5)" />
                                    <label for="tab-5" class="tab-label-5" onclick="changeContent(5)">Galeria</label>

                                          <input id="tab-6" type="radio" name="radio-set" class="tab-selector-6" onclick="changeContent(6)" />
                                    <label for="tab-6" class="tab-label-6" onclick="changeContent(6)">Convenios</label>

                                    <!--Shadow Bar-->
                                    <div class="clear-shadow"></div>

                            </section>
                        </div>
                    </div>
                </header>
                <!-- Content -->
                <div class="container">
                    <!-- Aside Menu -->
                    <aside class="menuaside">
                        <!-- E-Learning -->
                        <section>
                            <div class="button">
                                <a href="#" onclick="changeContent(7)">Anatolia Virtual</a>
                                <p class="top">Click Jardin Virtual</p>
                                <p class="bottom">Iniciar Sesión</p>

                            </div>
                        </section>
                        <!-- Principal Menu -->
                        <section>   <!-- Funciona bien, el problema es que el Li seleccionado no resalta como seleccionado, y si resalta la pestaña seleccionada antes -->
                           <nav class = "navbox">
                                <ul class = "navmenu">
                                    <li onclick="changeContent(8)"><a href="#">Servicios</a></li>
                                    <li onclick="changeContent(9)"><a href="#">Instalaciones</a></li>
                                    <li onclick="changeContent(10)"><a href="#">Colegios</a></li>
                                    <li onclick="changeContent(11)"><a href="#">Mapa del Sitio</a></li>
                                    <li onclick="changeContent(12)"><a href="#">Contactos</a></li>
                                </ul>
                           </nav>
                        </section>
                    </aside>
                    <!-- News -->
                    <article class="news_container"> <!-- Problema: Este div viene por defecto, pero si actualizamos la pagina, no se devuelve a la pestaña por defecto, cuando abrimos la pagina de nuevo, si lo hace -->
                            <div id="content">
                                                <div class='content-1'>
                          <time>24 de Marzo de 2013</time>
                          <h1> Bienvenidos a la pagina web del Jardin Infantil Anatolia</h1>
                          <h3>How we work</h3>
                          <p>Like you, I used to think the world was this great place where everybody lived by the same standards I did, then some kid with a nail showed me I was living in his world, a world where chaos rules not order, a world where righteousness is not rewarded. That's Cesar's world, and if you're not willing to play by his rules, then you're gonna have to pay the price. </p>
                            </div>
                    </article>
                </div>
                <!-- Footer -->
                <footer>
                    <!-- <hr>  __ Line -->
                    Calle 104 # 14ª – 30. Teléfono: 4810171. E-mail: <a href="info@jardinanatolia.com">info@jardinanatolia.com</a>. Bogotá, Colombia.<br> &copy 2013. Jardín Infantil Anatolia. Todos los Derechos Reservados.
               </footer>
            </body>
    </html>