Selectores

by cristianromagnoli

HTML

<div id="wrapper">         <div id="header">             <div class="inner">                 <div id="logo">                     <a href="/" title="Lector Comun"><img src="/images/lc.png" alt="Lector Comun" /></a>                     <h1>Lector Com&uacute;n</h1>                     <p class="ui-h3">Un sitio de cr&iacute;ticos pat&eacute;ticos</p>                 </div>                 <div id="nav">                                          <ul>                         <li><a href="/">Inicio</a>                                                     </li>                         <li><a href="#">Contenido</a>                                                                                   </li>                         <li><a href="/contacto/">Contacto</a></li>                     </ul>                                      </div>                 <div class="menu-items">                                                                  <div class="col col-1-of-6">                     <ul>                         <li><a href="">Inicio</a></li>                         <li><a href="/ultimas-entradas/">Ultimas Entradas</a></li>                         <li><a href="/invitados/">Invitados</a></li>                         <li><a href="/recomendados/">Recomendados</a></li>                         <li><a href="/caza-de-citas/">Caza de Citas</a></li>                         <li><a href="/contacto/">Contacto</a></li>                                              </ul>                                      </div>                                             <div class="col col-1-of-6 authorCol">                             <ul>                                 <li><a  class="authorLink" href="/miguel-dalmaroni/">Miguel Dalmaroni</a></li>                                                                 <li><a href="/miguel-dalmaroni/presentacion/">Presentación</a></li>                                                                 <li><a...

CSS

/* Copyright (c) 2011, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html version: 2.9.0 */ html{color:#000;background:#efefef} body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var{font:inherit}del,ins{text-decoration:none}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:baseline}sub{vertical-align:baseline}legend{color:#000}  em{ font-style:italic} strong{font-weight:bold} /*Layout Styles */ html{height:100%;} body {   font-family: Georgia,Helvetica,Arial;   font-style: normal;   font-weight: normal;   font-size: 12px;   background-image:url('bg/bg-body.jpg');   height:100%;   padding:25px 0;    }  a { text-decoration:none; color:#f19f3a } a:hover{color:#f19f3a; text-decoration:underline;}  .block{ display: none} .block.active{display: block;} #wrapper {     width: 990px;     margin: 0 auto;     border-top: 10px solid #5a3d10;     border-bottom: 10px solid #5a3d10;     background-color:#FFF; } #header{ padding: 20px; padding-bottom:0; margin-bottom:3px;  position: relative}  #logo a{ position: absolute} #logo h1{ position: absolute; left: 115px; top:30px} #logo p{ position: absolute; left: 115px; top: 60px} #header .inner{height: 95px}  #nav{position: absolute; right: 10px; top: 30px} #nav li{ display: block; margin: 0 10px; width: 160px; float: left; border-bottom:1px solid #dcdcdc; padding-bottom: 10px; font-size:1.3em; font-style: italic} #nav li a{ color: #5a3d10; text-decoration:none;} #nav li a:hover{color:#f19f3a}  .menu-items {     background-image: url('bg/bg-menu.png');     width: 589px;     height: 175px;   ...

JavaScript

$('body').click(function(e) {
        $('.menu-items').hide();
    });
    $('#nav a:eq(1)').click(function(e) {
        alert('asdasd')
        $('.menu-items').toggle();
        e.preventDefault();
        e.stopPropagation();
    });

/* Espacio de Ejercicios  */
$selectors = new Array();
$results= new Array();
    
// Ejercicio 1   
$selectors.push ("p");
$results.push( "1 - There are "+ $('p').size() + " elements");

//Ejercicio 2
$selectors.push('.entries-list li');
$results.push( "2 - There are "+ $('.entries-list li').size() + " elements");

//Ejercicio 3
$selectors.push ('a[href*="://"]');
$results.push( "3 - There are "+ $('a[href*="://"]').size() + " elements");

//Ejercicio 4
$selectors.push ('.entry-list:contains("Miguel")');
$results.push( "4 - There are "+ $('.entry-list:contains("Miguel")').size() + " elements");

//Ejercicio 5
$selectors.push (':header');
$results.push( "5 - There are "+ $(':header').size() + " elements");

//Ejercicio 6
$selectors.push ('.entries-list .more');
$('.entries-list .more').css('color', 'orange');
$results.push( "6 - There are "+ $('.entries-list .more').size() + "  elements");

//Ejercicio 7
$selectors.push ('input[name="email"]');
$('input[name="email"]').css('color', 'red');
$results.push( "7 - There are "+ $('input[name="email"]').size() + "  elements");

//Ejercicio 8
$selectors.push ('.entry-compact:contains("Ana")');
$('.entry-compact:contains("Ana")').css('background', 'black');
$results.push( "8 - There are "+ $('.entry-compact:contains("Ana")').size() + "  elements");

//Ejercicio 9
$selectors.push (':contains("es") + p');
$(':contains("es") + p').css('color', 'green');
$results.push( "9 - There are "+ $(':contains("es") + p').size() + "  elements");

//Ejercicio 10
$selectors.push ('#footer .authorCol a:not(".authorLink")');
$('#footer .authorCol a:not(".authorLink")').css('color', 'blue');
$results.push( "10 - There are "+ $('#footer .authorCol a:not(".authorLink")').size() + "  elements");

//Ejercicio...