Browsing all articles in HTML
May
9
0

IE, Forms, Image Submit Buttons = Bad Mojo

Author Chris Cummings    Category HTML, Internet Explorer     Tags

Been a while, huh?  Yeah well, you know…

Found out IE submits funky stuff for the value of a form button that is an image.  Better to slap a hidden field in your form.  More info here http://ednailor.wordpress.com/2010/02/22/problems-using-an-image-for-submit-button-in-ie/

So, yeah, that’s all.  Short but helpful?  I hope so.

Aug
8
0

The First Web Page: Kickin’ it old school…

Author Chris Cummings    Category General Nerdiness, HTML     Tags

Remember your first web page?  Mine was on Geocities.  Aaahhhhh, Geocities!  Good times.

Here is THE first web page…sorta.  It’s actually a revision of the first page (which no longer exists) but its an early revision.  The first page dropped in 1991 and this is a revision from 1992.

Enjoy: http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html

Jul
15
0

Cool moving background with CSS3

Author admin    Category CSS, HTML     Tags

I saw a cool thing on www.css-tricks.com (one of my favorite sites) and after looking at his code plus a few others was able to doit…so I present:
COOL SLIDE IN BACKGROUND (not the best name but, whattyagonnado?)

Here’s the code…all you need is a png file named droid.png:

 

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
#thebox {	
-webkit-border-radius: 14px;	
-moz-border-radius: 14px;	
border-radius: 14px;	
background-color: #10365b;	
height: 300px;	width: 400px;	
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;	
color: #FFF;	font-size: 30px;	
background-image: url(droid.png);	
background-position: 390px 0px;	background-repeat:no-repeat;	
overflow: hidden;}#thebox p {	padding-top: 16px;	
padding-right: 150px;	
padding-bottom: 16px;	
padding-left: 16px;}#thebox:hover  {		
position: absolute;	
background-color: #30567b;	
background-image: url(droid.png);	
background-position: 190px 0px;	background-repeat:no-repeat;			
-webkit-transition: all 0.8s ease; 	
-moz-transition: all 0.8s ease; 	
background-position: 220px 100%; 	
background-repeat: no-repeat;	}
</style></head>
<body>	<div id="thebox">	  
<p>This is a cool box with some text in it </p>	  
<p>OK, that's all.</p>	
</div>
</body></html>
Jul
1
0

Super Helpful Nerdy Web Design Type Links

Author Chris Cummings    Category CSS, HTML, Javascript, jQuery, Web Design     Tags

I love CSS-TRICKS.COM.  Always interesting, usually helpful…but today its MEGA HELPFUL!  This post in particular:

http://css-tricks.com/12389-one-page-apps-i-actually-use/

Why?  Because I’m always looking up the code for rounded corners or trying to find the exact link to jQuery…here are some great links from that article!

That’s it.  Have fun. :-)

Jun
22
1

Let Google Host Your jQuery

Author Chris Cummings    Category HTML, jQuery     Tags

I cannot seem to find one particular place where this info is available (maybe i’m loosing meh mad googlin’ skills?) but here it is:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" type="text/javascript"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />

So the first line is your jquery, the 2nd is your jquery ui, the 3rd is the CSS.  ’nuff said.

May
10
0

Comments and Firefox: Watch How You Form Them!

Author admin    Category HTML, Web Design     Tags

I had a WordPress theme I was modifying and like a good little coder I kept adding these types of comments

<!– HERE IS A COMMENT —————————————————————->

I make that long line so all my comments line up down the page.  While my page was working fine everywhere else, it kept breaking in Firefox and I couldn’t figure out why.  Finally I ran across this post:

http://stackoverflow.com/questions/3050317/can-comments-in-html-and-css-ever-create-rendering-problems

which leads here:

http://weblog.200ok.com.au/2008/01/dashing-into-trouble-why-html-comments.html

and explains that while all other browsers render –> as the end of a comment, FF thinks –> OR — is the end of a comment.

Problem solved! :-)  Code on, coders!