Ciao a tutti,
Nel momento in cui clicco sul tasto in alto a destra, parte la funzione in Jquery, la quale aggiunge una classe cosi da fare visualizzare un menù.
Nel menu ci saranno vari checkbox, sto trovando problemi nel chekkarli.
Come posso fare?
Grazie mille
codice:<html> <head> <style> .ItemLoc:hover { -webkit-box-shadow: 0 0 25px #FFF; -moz-box-shadow: 0 0 12px #FFF; -o-box-shadow: 0 0 12px #FFF; -ms-box-shadow: 0 0 12px #FFF; transform: scale(1.1); cursor: pointer; } .Locandina { position: relative; height: 150px; width: 100%; } .Locandina img{ margin: 0 auto; max-height: 150px; border-radius: 6px 6px 0px 0px; } .InfoTrama{ text-align: center; margin: 10px auto 0 auto; height: 60px; overflow: hidden; } .ItemLoc{ border: 1px solid #DDD; border-radius: 6px; background-color: rgba(0,0,0,0.6); transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; width: 50%; } .ItemLoc:hover .List{ position: absolute; top: 0; right: 0; width: 16px; height: 16px; background: url(../images/likelist.png) no-repeat -32px; } .ItemLoc .List:hover{ position: absolute; top: 0; right: 0; width: 16px; height: 16px; background: url(../images/likelist.png) no-repeat -51px; } .ItemLoc:hover .Like{ position: absolute; top: 0; right: 16px; width: 16px; height: 16px; background: url(../images/likelist.png) no-repeat 0px; } .ItemLoc .Like:hover{ position: absolute; top: 0; right: 16px; width: 16px; height: 16px; background: url(../images/likelist.png) no-repeat -15px; } .ItemTit, .ItemSocial{ text-align: center; } .ItemTit { width: 50%; padding: 10px 0; font-family: verdana; font-weight: bold; font-size: 16px; letter-spacing: -1px; } .ItemSocial{ width: 80px; } .ItemLoc .DrawCon{ display: none; } .ItemLoc:hover .List.ItemList .DrawCon{ line-height: 29px; padding: 10px; display: block; background: black; font-family: arial; position: absolute; top: 30px; width: 170px; border: solid 1px #CBC9C7; border-color: rgba(0, 0, 0, 0.15); border-radius: 3px; box-shadow: 0 1px 2px #F2F1F1; z-index: 10; left: -147px; } .ItemLoc:hover .List.ItemList .Draw{ background: url(../images/menu.png) no-repeat -229px 0 transparent; width: 16px; height: 16px; position: absolute; top: 21px; right: 8px; z-index: 10; } .ItemLoc .List .MyNewList{ background-color: transparent; border: 0px; padding: 0px; height: 20px; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(document).ready(function(){ /*Crea lista in pagina ricerca*/ $('.List').click(function(){ if ($(this).hasClass('ItemList')){ $(this).removeClass('ItemList'); } else { $(this).addClass('ItemList'); } return false; }).children().click(function(e) { $(this).prop( "checked", true ); return false; }); /*$(".ItemLoc").mouseleave(function(){ $(this).find(".ItemList").removeClass('ItemList'); });*/ }); </script> </head> <body> <div class="ItemLoc"> <a href=""> <div class="Locandina"> <div class="Like"><div> </div> </div> <div class="List"> <div class="DrawCon">Le mie liste <form method="post" action="list.aspx"> <input type="checkbox" name="MyList" value="Aperitivo"> Aperitivo<br> <input type="checkbox" name="MyList" value="Sipiglia"> Si piglia<br> <input type="text" name="MyNewList" class="MyNewList"><hr> </form> </div> <div class="Draw"></div> </div> </div> </body> </html>
Rispondi quotando
