Second Opinion
Folosind serviciul second opinion ne puteți trimite RMN-uri, CT -uri, angiografii, fișiere .pdf, documente medicale. Astfel vă vom putea da o opinie neurochirurgicală, fără ca aceasta să poată înlocui un consult de specialitate. Răspunsurile vor fi date prin e-mail în cel mai scurt timp posibil (de obicei în mai putin de 24 de ore, dar nu mai mult de 48 de ore). Second opinion – Neurohope este un serviciu gratuit. www.neurohope.ro |
meniu cu background transparent
Last Updated: Feb 16 2010 21:04, Started by
alin19
, Feb 16 2010 20:39
·
0
#1
Posted 16 February 2010 - 20:39
incerc sa ii fac cuiva un meniu cu un background transparent;
chiar daca pare usor la prima impresie(asa am zis si eu) este destul de complicat; deci : este un div cu id-ul content care are o imagine ca background; peste el un div cu id-ul menu si cu un background cu opacity:0.4; peste el un div cu continut care trebuie sa fie cu opacity:1; iar colturile div-ului cu id-ul menu sunt rotunde; trebuie sa functioneze si in internet explorer; singura solutie pe care am gasito este cu javascript am : <div id="menu"></div> <div id="menu_content"></div> <div id="menu_head"></div> <div id="menu_footer"></div> toate cu position absolute; menu il asez in centrul div-ului content; redimensionez menu sa poata contine menu content si sa para ca este inclus in el ( de fapt fiind deasupra cu un index mai mare) asez menu_content peste menu menu_head contine 2 imagini de aceiasi culoare cu background-ul menu (una in stanga una in dreapta) inca un div pe centru cu background-ul de aceiasi culoare ca si menu si menu_head are opacity:0.4; menu head este asezat cu javascript exact inainte de menu la menu footer aceiasi lucru ca si la menu_head numa ca este asezat dupa menu intrebarea mea este: se poate face toata chestia asezand ceva mai normal elementele <!DOCTYPE HTML PUBLIC"-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <!-- mbpc - margin, border, padding, content--> <style> body,div {margin:0px;padding:0px;text-align:center;} #content {background:url("test.gif");width:360px;height:360px;margin:auto;position:relative} #menu { width:320px; margin:auto; background-color:gray; position:relative; filter:alpha(opacity=40); opacity:0.4; } #menu_head { width:100%; background-color:gray; position:absolute; left:0px; top:0px; height:19px; filter:alpha(opacity=40); opacity:0.4; } #menu_footer { width:100%; background-color:gray; position:absolute; left:0px; bottom:0px; height:19px; filter:alpha(opacity=40); opacity:0.4; } #menu_content{top:0px;position:absolute;z-index:3;} #menu_line1{ border-bottom-width:2px; border-bottom-color:#ffffff; border-bottom-style:solid;} span{height:100%;text-align:center;padding:4px;text-decoration:none;color:black;} span.border{border-right-width:2px; border-right-color:#ffffff;border-right-style:solid;} a{margin:5px; text-decoration:none;color:#ffffff;} a:hover{text-decoration:underline;} #image_copy { position:absolute; right:5px; bottom:30px; } #sh_footer{ height:30px; width:100%; text-align:center; font-size:12px; display: table; clear:both;/*turn off any float before footer*/ background-color:#333; /* for IE */ filter:alpha(opacity=40); /* CSS3 standard */ opacity:0.4; position:absolute; left:0px; bottom:0px; } #sh_footer p { display: table-cell; vertical-align: middle; color:#fff; } #sh_footer span { color:#fff; font-weight:bold; } #sh_footer a {text-decoration:none} </style> <script type="text/javascript"> function fix() { /* * * arange menu in the center of the body * */ var menu=document.getElementById("menu"); var menu_content=document.getElementById("menu_content"); var menu_head=document.getElementById("menu_head"); var menu_footer=document.getElementById("menu_footer"); //menu.style.left=(menu.parentNode.offsetWidth-menu.offsetWidth)/2; menu.style.top =(menu.parentNode.offsetHeight-menu.offsetHeight)*50/100; /** * resize menu to contain menu content * */ menu.style.height=menu_content.offsetHeight+20; /** * arange menu content in the center of menu */ menu_content.style.left=menu.offsetLeft+((menu.offsetWidth-menu_content.offsetWidth)/2); menu_content.style.top=menu.offsetTop+((menu.offsetHeight-menu_content.offsetHeight)/2); /* * * we arange menu head and menu footer divs */ menu_head.style.left=menu.offsetLeft; menu_head.style.width=menu.offsetWidth; menu_head.style.top = menu.offsetTop-19; menu_footer.style.left=menu.offsetLeft; menu_footer.style.width=menu.offsetWidth; menu_footer.style.top = menu.offsetTop+menu.offsetHeight; } </script> </head> <body onload="fix()" > <div id="content"> <div id="menu_head"></div> <div id="menu"> </div> <div id="menu_footer"></div> <div id="image_copy"><span>©</span></div> <div id="sh_footer"> <p><a href="#"><span>ConfusedMe</span></a> | <a href="#"><span>CreateWebsite</span></a> | <a href="#"><span>Settings</span></a> | <a href="#"><span>Annoyed</span></a></p> </div> <div id="menu_content"> <div id="menu_line1"> <span class="border"><a href="#" >vertical 1</a></span> <span class="border"> <a href="#" >vertical 2</a></span> <span> <a href="#" >vertical 3</a></span> </div> <div id="menu_line2" > <span class="border" > <a href="#">vertical 4</a></span> <span class="border" > <a href="#">vertical 5</a></span> <span> <a href="#" >vertical 6</a></span> </div> </div> </div> </body> </html> Edited by alin19, 16 February 2010 - 20:49. |
#2
Posted 16 February 2010 - 21:04
Pentru IE folosesti filter:alpha(opacity=40) pentru opacitate 40%.
Ti-as da raspuns si la restul dar nu stiu cum ai gandit. Nu-mi dau seama din descriere ce ai vrut sa faci. Daca ai posta codul ar fi bine. Nu-i cel mai simplu sa faci un PNG cu transparenta 0.4 si sa-l pui ca background la meniu, astfel incat tu sa nu mai pui opacity prin CSS? Teoretic ar ramane cu opacity 1 si lucrezi cum vrei. Singuru dezavantaj e ca trebuie sa te chinui putin sa-l faci s amearga pe IE6. Edited by Ion_Cristoiu, 16 February 2010 - 20:47. |
Anunturi
▶ 0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users