Well, you could use <small>(all 3 gyms)</small> and adjust the size with CSS if you want the text to be even smaller. For example <small style="font-size:7pt;">(all 3 gyms)</small> And you might want to remove all but one of those <tr> tags, and add a closing </tr> after the </h4> (which isn't properly nested, but as long as the table looks the way you'd like it to, it probably won't be much of a problem)
Hope this helps,
Traevel
Hi there,
Perhaps this might get you started.
<html>
<head>
<title>Multicolor table</title>
<style type="text/css">
#sheet{
width:563px;
border-collapse:collapse;
border:1px solid #000000;
}
#sheet .title{
text-transform:uppercase;
font-size:14pt;
text-align:center;
}
#sheet th{
padding:5px;
background-color:#CDCDCD;
border-top:1px solid #000000;
border-bottom:1px solid #000000;
text-align:center;
font-weight:normal;
font-size:9pt;
width:33%;
}
#sheet td{
padding:5px;
background-color:#FFFFFF;
text-align:center;
font-size:9pt;
width:33%;
}
</style>
</head>
<body>
<table id="sheet">
<tr>
<td class="title">Membership</td>
<td class="title">EFT Withdrawal</td>
<td class="title">Joining fee</td>
</tr>
<tr>
<th>Individual (all 3 gyms)</th>
<th>$36</th>
<th>$25</th>
</tr>
<tr>
<td>Couple (all 3 gyms)</td>
<td>$50</td>
<td>$25</td>
</tr>
<tr>
<th>Student / Senior (all 3 gyms)</th>
<th>$31</th>
<th>$25</th>
</tr>
<tr>
<td>Midnight Express <br>(Marysville gym, after hours)</td>
<td>$19</td>
<td>$25</td>
</tr>
<tr>
<th>Viking Express <br>(Port Huron only, 24/7)</th>
<th>$19</th>
<th>$25</th>
</tr>
</table>
</body>
</html>Use <th>text here</th> for gray and <td>text here</td> for white colored backgrounds.
Good luck,
Traevel
Hi there,
Apart from the issues Cragdo mentioned above, line 463 has an unnecessary <p> tag.
To answer your question: the "white space" is being caused in line 456 <div class="luke" style="position: relative; top: -929px; It could be because of the png-image (IE doesn't really like them) but a quick fix might be <div class="luke" style="position: absolute; top: 220px; By the way, the layout only seems to work at a screen-width of 1280 pixels. :icon_eek:
You might want to look into that. :D
Good luck,
Traevel
Hi there, onChange cannot be used in <a> . Neither can checked . Try using <a onClick=""> instead. Or make it a checkbox, of course.
Traevel
Hi there,
Replacing...
function init(){
var ep = 1289257200;;
var ct=Math.round(new Date().getTime()/1000);
var width = getWidth();
var height = getHeight();
if(ep>ct){
var opts = {};
opts.id = 'page';
opts.width = width;
opts.height = height;
opts.scriptable = 'true';
opts.allowScriptAccess = 'sameDomain';
opts.loop = 'false';
opts.quality = 'high';
opts.bgcolor = '#ffffff';
opts.scale = 'noscale';
opts.swliveconnect = 'true';
opts.flashvars = 'pageURL='+pageURL+'&prepared=true';
swfembed ('player_all.swf', opts);
pd();
}
else {
var html = "<table width='"+width+"' height='"+height+"'><tr>";
html += "<td align='center' valign='middle' style='color:red;font-family:Arial'><strong>resource has expired.</strong></td>";
html += "</tr></table>";
document.write(html);
pd();
}
}with...
function init(){
var width = getWidth();
var height = getHeight();
var opts = {};
opts.id = 'page';
opts.width = width;
opts.height = height;
opts.scriptable = 'true';
opts.allowScriptAccess = 'sameDomain';
opts.loop = 'false';
opts.quality = 'high';
opts.bgcolor = '#ffffff';
opts.scale = 'noscale';
opts.swliveconnect = 'true';
opts.flashvars = 'pageURL='+pageURL+'&prepared=true';
swfembed ('player_all.swf', opts);
pd();
}...should do the trick.
Good luck,
Traevel
<script type="text/javascript">
window.onload = function(){
var now = new Date();
var hour = now.getHours();
var vwimg = "";
if(hour < 19 & hour >= 6){ //Daytime(6h - 19h)
vwimg = "day_loader.html";
}else if(hour <= 24 & hour >= 19){ //Night (19h - 6h)
vwimg = "night_loader.html";
}else if(hour < 6 & hour >=0){
vwimg = "night_loader.html";
}
document.getElementById("linkContainer").innerHTML="<a href='' onClick=\"window.open('" + vwimg + "','Loader','location=yes,resizable=yes,scrollbars=yes');\"><img src='/images/hotel-button-hotelopen.png' alt='"+vwimg+"'></a>";
};
</script><div id="linkContainer"></div>That should work, yes :P
If the <div causes layout trouble you could always turn it into a <span by the way.
<script type="text/javascript">
window.onload = function(){
var now = new Date();
var hour = now.getHours();
var vwimg = "";
if(hour < 19 & hour >= 6){ //Daytime(6h - 19h)
vwimg = "day_loader.html";
}else if(hour <= 24 & hour >= 19){ //Night (19h - 6h)
vwimg = "night_loader.html";
}else if(hour < 6 & hour >=0){
vwimg = "night_loader.html";
}
document.getElementById("linkContainer").innerHTML="<a href='' onClick=\"window.open('" + vwimg + "','Loader','location=yes,resizable=yes,scrollbars=yes');\">Loader</a>";
};
</script>Add <div id="linkContainer"></div> where you'd like the link to be.
Change... document.getElementById("linkContainer").innerHTML="<a href='"+vwimg+"'>"+vwimg+"</a>"; into... document.getElementById("linkContainer").innerHTML=vwimg; And I think 'location=yes','resizable=yes','scrollbars=yes' should be 'location=yes,resizable=yes,scrollbars=yes' Although if the attributes of the popup remain the same, you could also place those at the end...
/*snip*/
else if(hour < 6 & hour >=0){
vwimg = 'site 2';
}
document.getElementById("linkContainer").innerHTML="<A onclick=\"window.open(vwimg, 'Loader','location=yes,resizable=yes,scrollbars=yes');return false;\" href=\"\">Loader</A>";note: not tested :$ just a quick draft :)
Hi there,
Perhaps something like this.
<script type="text/javascript">
window.onload = function(){
var now = new Date();
var hour = now.getHours();
var vwimg = "";
if(hour < 19 & hour >= 6){ //Daytime(6h - 19h)
vwimg = "http://www.whatever.com/link1";
}else if(hour <= 24 & hour >= 19){ //Night (19h - 6h)
vwimg = "http://www.whatever.com/link2";
}else if(hour < 6 & hour >=0){
vwimg = "http://www.whatever.com/link2";
}
document.getElementById("linkContainer").innerHTML="<a href='"+vwimg+"'>"+vwimg+"</a>";
}
</script>Depending on where you'd like the link to appear you'd might want to change the last line (linkContainer) accordingly.
Regards,
Traevel
I'll give you something to start with...
totalM() do not name a variable totalM ...it just messes things updocument.onkeydown = calc;
function calc(e){
if (!e) var e = window.event;
(e.keyCode) ? key = e.keyCode : key = e.which;
if (key == 13){
totalM();
//totalF();
//averageGrade();
} else {
document.average.TM.value = "";
}
}
function totalM(){
QM1 = parseInt(document.average.QM1.value);
QM2 = parseInt(document.average.QM2.value);
LQM = parseInt(document.average.LQM.value);
AM = parseInt(document.average.AM.value);
var total = ((QM1+QM2+LQM+AM)/(4));
if(!isNaN(total)){
document.average.TM.value = total;
} else {
document.average.TM.value = "";
}
}Good luck,
Traevel
Code tags :)
About the general code...
Errors: 12
Warnings: 140
<html>
<head>
<title></title>
</head>
<body>
<!--content here -->
</body>
</html>About the JavaScript...
Like I said, build a condition to check for complete input-fields. It may require to rewrite most of the code and different triggering; you ask for an output change whenever someone deletes a number, but yet the only way to get an output in your current form is when someone fills out the numbers (top to bottom) and presses "enter" halfway down the field (which no one would've figured out unless he/she is browsing through your code).
A few last tips to simplify the code:
document.average.FG.value in a variabledocument.average.GPA.value document.average.V.value if (QM1 != "" & QM2 != "" & ... ) etc.Good luck,
Traevel
Hi there,
Could his screen perhaps be bigger? :D
You're using background-repeat:no-repeat; so perhaps his background ran out of image and showed the color black instead. :P
If you'd like to repeat the image vertically use background-repeat:repeat-y; If that's not it, could you mention the size of the background image in pixels?
Good luck,
Traevel
In that case you would need to find a way to check whether all values are actually inserted in the text boxes. For instance:
if (/*all inputs are filled*/){
// calculate average
} else {
// update the field values
}
On a side note... it would be a lot easier if you would place your code in code-tags. Now I'll just have to guess the line numbers :P
Change line 5 in: <script type="text/javascript">
Change all the onKeyUp="totalM()" in: onKeyUp="javascript:totalM()" But remember that any key could trigger that, including TAB, which in return would cause errors. A submit button would be the simplest solution, but in order to keep the field updating on key press it would be best to monitor this by using events, instead of this 'ugly' onKeyUp solution.
To clear a field you could simply assign an empty value to the field: document.average.TM.value = "";
To check whether a field is empty, again use something like if(document.average.TM.value=="")
Finally, a few minor changes/remarks...
There are no <body> tags
The <title> should be between <head> tags
On line 126: the <h1> is nested incorrectly and there is an incorrect <table>
Same on line 159.
Hope this helps a little,
Traevel
Hi there,
Just at first glance, you're calling the function by using onKeyPress . This means that as soon as you press a key the function gets called; there simply isn't a number in the field (yet) at the moment the function is being called. Try changing onKeyPress into onKeyUp for starters, and see if that works.
Good luck with your assignment,
Traevel
Hi there,
While testing the form you described I found typing with such alterations to be extremely annoying, but here goes :P
var col = 4; //number of 'cells' in a row
var current;
var next;
document.onkeydown = check;
function check(e){
if (!e) var e = window.event;
(e.keyCode) ? key = e.keyCode : key = e.which;
var num = document.getElementById("Table").getElementsByTagName("input").length;
try{
switch(key){
case 37: next = current - 1; break; //left
case 38: next = current - col; break; //up
case 39: next = (1*current) + 1; break; //right
case 40: next = (1*current) + col; break; //down
}
if (key==37|key==38|key==39|key==40){
/* Submit etc.*/
var code=document.forms['Table'].elements['c' + current].value;
if(code!=""){alert(code);}
document.forms['Table'].elements['c' + next].focus();
current = next;
}
}catch(Exception){}
}
function setCurrent(element){
var string = element.id;
current = string.slice(1,string.length);
}With some HTML to test...
<form id="Table" name="Table" onKeyPress="javascript:check">
<input id="c1" onClick="setCurrent(this);" type="text" value=""/>
<input id="c2" onClick="setCurrent(this);" type="text" value=""/>
<input id="c3" onClick="setCurrent(this);" type="text" value=""/>
<input id="c4" onClick="setCurrent(this);" type="text" value=""/><br>
<input id="c5" onClick="setCurrent(this);" type="text" value=""/>
<input id="c6" onClick="setCurrent(this);" type="text" value=""/>
<input id="c7" onClick="setCurrent(this);" type="text" value=""/>
<input id="c8" onClick="setCurrent(this);" type="text" value=""/><br>
<input id="c9" onClick="setCurrent(this);" type="text" value=""/>
<input id="c10" onClick="setCurrent(this);" type="text" value=""/>
<input id="c11" onClick="setCurrent(this);" type="text" value=""/>
<input id="c12" onClick="setCurrent(this);" type="text" value=""/><br>
</form>I wasn't really sure if something like this is what you meant, but it should work in the latest FF and IE, although I haven't tested it as much as I should have :$. Still, I hope this helps a little.
Good luck,
Traevel
Hi there,
At first glance I notice the original function is function LoadGallery(pictureName,imageFile,titleCaption,captionText) while yours is function LoadGallery(pictureName,imageFile) . Yet on line 88 you call the LoadGallery function with 4 parameters <a href="#_self" onclick="LoadGallery('showreel','$image','showcaption','$caption')"> .
The JavaScript errors you keep getting on your site do mention the lack of a 'titleCaption' variable so perhaps it's a quick fix.
Again, try replacing
function LoadGallery(pictureName,imageFile)with
function LoadGallery(pictureName,imageFile,titleCaption,captionText)Hope that helps.
Good luck,
Traevel
Would those tags happen to be in between the <ul> tags? In that case they would still create a whitespace above your header. The suggestions almostbob made should help in removing all the margins for ul and li tags, and they certainly remove the whitespace in Firefox with the code you provided. If you're only interested in removing the top margin, you could also use
ul{margin-top:0;}If the whitespace keeps returning with different tags just add the line tag{margin-top:0;} or tag{margin:0;} for the specific tag(s) as well.
Hope that helps, good luck.
Traevel
Hi there,
This might not solve your problem right away, but it might prevent some issues in the future (especially if you're copying your code over and over).
On lines 11 and 18 of your HTML code you are using cellpadding and cellspacing, but neither one is a valid CSS property. Instead you could place them outside the style tag to get the desired effect.
<table cellpadding="0" cellspacing="0" style="width: 780px; margin-top: 40px; border: 1px solid;">Furthermore, it is best not to place properties like height, width, margin etc. in the element itself, but in a box model. Perhaps this page might be of some help.
At first I thought your problem had something to do with the differences between IE and FF, but after reading again I noticed you mentioned differences between identical pages within the same browser. Personally, I haven't spotted any errors in layout in IE or FF with your code, other than the absence of the images of course. Perhaps the following changes in the code might solve it, although I'm not exactly sure.
The new HTML now uses a div as "container" instead of the entire body. The CSS has been changed to maintain layout. One last note: since your code did not handle the "cellpadding" and "cellspacing" correctly, you might see some differences in table-layout. Just remove them if you'd wish to return to the previous look.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> …It seems that there are a lot of <BR /> tags in between your table headers (269 to be exact :-O ) starting from line 756. Deleting those tags should remove the large number of line breaks.
Well, you could save the url you'd like to search into a string and use the JavaScript match() method: stringObject.match(searchvalue) to search for a specific word inside the string. If you want to, you can also opt for a different method and use Regular Expressions to search for recurring patterns within a string.
You can usually find information like this at W3Schools.
Good luck! :)