Hej!
Har en sida som är 100% hög och 100% bred med tabeller. Sidan fungerar allmänt snyggt tills jag försöker infoga min layer. Då slutar kalaset med att jag får en vertikal scroll på hela sidan, dvs som om sidan är mer än 100% hög.
#Layer1 {
position:absolute;
left:0px;
bottom:0px;
width:697px;
height:249px;
visibility:hidden;
z-index:1;
}
jag har provat att sätta bottom till mellan 0-30px utan resultat, även satt left till samma värden, mellan 0-30px utan resultat. I skrivande stund får jag en scroller som scrollar 4-5px neråt. Endast i Firefox får jag scrollern, i MSIE så fungerar det utmärkt.
Sen har jag problem nummer två:
I detta layer har jag en IFRAME, och i IFRAMEN finns ett formulär i form uttav Textarea. När min layer är "hidden" så är tanken att bakgrunden ska synas, dvs en annan IFRAME, men ungefär mitt på IFRAMEN så har jag en "osynlig" textarea från layern. Detta problem uppenbarar sig endast i MSIE, inte i Firefox.
jag kan tillochmed skriva saker i textarean när den är hidden, fast man ser inte vad man har skrivit förns man har valt att visa lagret igen! Men det är Galet störande! :e
Sidan validerar HTML 4.01!
Här är koden till framen som innehåller textarean:
<script language="javascript" type="text/javascript" src="tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
language : "sv",
mode : "textareas",
theme : "advanced",
width : "100%",
height : "95%",
plugins : "table,save,advhr,advimage,advlink,emotions,iespell,insertdatetime,preview,zoom,flash,searchreplace,print,contextmenu",
theme_advanced_buttons1_add_before : "save,separator",
theme_advanced_buttons1_add : "fontselect,fontsizeselect",
theme_advanced_buttons2_add : "separator,insertdate,inserttime,preview,zoom,separator,forecolor,backcolor",
theme_advanced_buttons2_add_before: "cut,copy,paste,separator,search,replace,separator",
theme_advanced_buttons3_add_before : "tablecontrols,separator",
theme_advanced_buttons3_add : "iespell,flash,advhr,separator,print",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_path_location : "bottom",
plugin_insertdate_dateFormat : "%Y-%m-%d",
plugin_insertdate_timeFormat : "%H:%M:%S",
extended_valid_elements : "a[name|href|target|title|onclick],img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name],hr[class|width|size|noshade],font[face|size|color|style],span[class|align|style]",
external_link_list_url : "example_data/example_link_list.js",
external_image_list_url : "example_data/example_image_list.js",
flash_external_list_url : "example_data/example_flash_list.js"
});
</script>
</head>
<body>
<form method="post" style="margin:0px;" action="update_page.asp?sida=">
<textarea name="content" cols="50" rows="15">hehe</textarea>
Hel sidans kod är:
<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN'>
<html>
<head>
<title>>heraghi CMS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
height:100%;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<link href="css/css.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:0px;
bottom:0px;
width:675px;
height:300px;
z-index:2;
visibility:hidden;
}
#Layer2 {
position:absolute;
left:0px;
top:51px;
width:200px;
height:300px;
z-index:1;
background-color:#CCCCCC;
visibility:hidden;
}
-->
</style>
<script language="JavaScript" type="text/javascript">
function show(id){
if(document.all){
document.all[id].style.visibility = "visible";
}else if(document.layers){
document.layers[id].visibility = "show";
}else if(document.getElementById){
document.getElementById(id).style.visibility = "visible";
}
}
function hide(id){
if(document.all){
document.all[id].style.visibility = "hidden";
}else if(document.layers){
document.layers[id].visibility = "hide";
}else if(document.getElementById){
document.getElementById(id).style.visibility = "hidden";
}
}
</script>
</head>
<body>
<div id="Layer1">
<table style="width:100%; height:100%;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="height:20px;"><a href="#" onClick="hide('Layer1');"><img src="images/wysiwygeditor.gif" width="100" height="20" alt="" border="0"></a></td>
</tr>
<tr>
<td style="background-color:#3399ff; height:100%;"><table style="width:100%; height:100%;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" style="height:10px;"></td>
</tr>
<tr>
<td style="width:10px;"></td>
<td ><iframe scrolling="no" style="width:100%; height:100%; border:0px;" src="wysiwyg.asp"></iframe></td>
<td style="width:10px;"></td>
</tr>
<tr>
<td colspan="3" style="height:10px;"></td>
</tr>
</table></td>
</tr>
</table>
</div>
<div id="Layer2"></div>
<table style="width:100%; height:100%;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="height:51px;" colspan="3"><table style="width:100%;" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="images/logo.jpg" alt="" width="500" height="46"></td>
</tr>
<tr>
<td style="background-image:url(../CMS/images/border3.gif); height:5px;"></td>
</tr>
</table></td>
</tr>
<tr>
<td style="width:20px; vertical-align:top;"><a href="#" onClick="show('Layer2'); hide('Layer1');">M<br>
E<br>
N<br>
Y</a></td>
<td style="width:100%; height:100%; padding: 30px 30px 30px 30px;">
<div style="height:100%; z-index:3;" align="center"><iframe src="sida.asp" style="width:100%; height:100%;"></iframe>
</div></td>
<td rowspan="2" style="width:200px; height:100%; vertical-align:top;"><!--#include file="sitetree.asp" --></td>
</tr>
<tr>
<td colspan="2" style="height:20px;"><a href="#" onClick="show('Layer1'); hide('Layer2');">
<img src="images/wysiwygeditor.gif" alt="" border="0"></a></td>
</tr>
</table>
</body>
</html>