android - layering within an HTML inside a webview -
i have html assets show webview in android. current browsers shown well, older browsers such android 2.1 goes see in images.
put code in case wants see.
html
<!doctype html public "-//w3c//dtd html 4.01 transitional//en" "http://www.w3.org/tr/html4/loose.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>documento sin tÃtulo</title> <script> function show(divactual,textactual) { if(document.getelementbyid(divactual).style.display == "block"){ document.getelementbyid(divactual).style.display = "none"; document.getelementbyid(textactual).innerhtml = "show details..."; } else if(document.getelementbyid(divactual).style.display == "none"){ document.getelementbyid(divactual).style.display = "block"; document.getelementbyid(textactual).innerhtml = "hidden details..."; } } </script> <style type="text/css"> body{ background-color:transparent; font-family: verdana, geneva, sans-serif; font-size: 1.0em; font-style: normal; color:#999999; margin:10px; } body a{ color:#0cf; text-decoration:none; } #bg { z-index: -14; width: 100%; } #letrapequena { font-family: verdana, geneva, sans-serif; font-size: 0.6em; color: #00537c; } #tituloseccion{ font-family: verdana, geneva, sans-serif; font-size: 1.5em; font-style: normal; font-weight: bold; color:#7ab800; } #headtwo{ font-family: verdana, geneva, sans-serif; font-size: 1.2em; font-style: normal; font-weight: bold; color:#7ab800; } #headthree{ font-size: 1.1em; font-style: normal; font-weight:bold; color:#00537c; } #container{ background-color:#d8f7fe; margin:10px 0; color:#00537c; font-weight:bold; } </style> </head> <body style="background-color:transparent;"> <div id="tituloseccion"> titleone </div> <hr align="left" width="90%" size="0.1em" color="#999999"> <div id="headtwo">titletwo</div> <div id="bigcontainer" style="display:block;"> <div id="headthree">titlethree</div> <div id="generalcont" style="display:block;"> <div id="container" style="display:block;"> <div style="display:inline">parrone </div> <div style="display:inline;"> <a href="javascript:show('info1','text1');" id="text1">show datails...</a> </div> </div> <div id="info1" style="display:none;" > text text text text text text text text </div> </div> <div id="generalcont" style="display:block;"> <div id="container" style="display:block;"> <div style="display:inline">parrtwo </div> <div style="display:inline;"> <a href="javascript:show('info2','text2');" id="text2">show details...</a> </div> </div> <div id="info2" style="display:none;" > text text text text text text text </div> </div> </div> <div id="letrapequena" style="display:block;"> text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </div> </body> </html>
java
package es.ibys.prueba.webview; import android.app.activity; import android.graphics.color; import android.os.bundle; import android.webkit.webview; public class pruebawebviewactivity extends activity { /** called when activity first created. */ @override public void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.main); webview mywview = (webview) findviewbyid(r.id.webview); string miurl = "file:///android_asset/index2.htm"; mywview.getsettings().setjavascriptenabled(true); mywview.setbackgroundcolor(color.transparent); mywview.loadurl(miurl); } }
not know how fix it. i've tried changing layer, css, div, styles ... has occurred me. happened? how did managed? please help
are sure isn't problem js?
here's fiddle code in it: http://jsfiddle.net/8wsvu/
is show() function in pure js android function, or supposed js? i'm not great enough yet in js know if is, googling turned no results being js function.
my second guess why it's layering wrong because div's being absolute positioned on top of each other.
if can use jquery showing , hiding elements on page, lot simpler.
Comments
Post a Comment