K4 laboratory portfolio by Maciej Rakowski
-
K4 laboratory
Posted by Rob Cornish
March 25, 2008
Tags: animation, drawing, graphics, illustration, k4lab, laboratory, logo, painting, polish, t-shirt, web | Comments (0)
-
Ilk
Posted by Rob CornishMarch 24, 2008
Ilk portfolio by Ludovic P.
Tags: france, graphic design, ilk, illustration, paint, paris, photography, web | Comments (0)
-
Drout750
Posted by Rob Cornish
Drout750 portfolio by Paul O'Sullivan
Tags: america, design, drout750, illustration, print, web | Comments (0)
-
Asp contact form with javascript validation
Posted by Rob Cornish
Firstly setup the html file with your form, set the name and id of this as "enquiryform". The form action needs to point to emailprocess.asp. Edit the values to suit the form.
To validate the form, use the onsubmit syntax:
<form onsubmit="return checkform(this);">This calls in the validate.js javascript file, edit the fields within the javascript to check for a value.
Once submitted the emailprocess.asp takes all the data and sends it to the email provided in the .asp file.
Tags: asp, contact, email, enquiry, form, html, javascript, validation | Comments (0)
-
IE6 PNG support
Posted by Rob Cornish
Using Angus Turnbull's iepngfix.htc you can add png support to IE6.
In order to make this work, you also need the blank.gif image.
Open up the iepngfix.htc in your favourite text editor and make sure the path to blank.gif is correct.Within the css document add the following behavior:
img, div { behavior:url(iepngfix.htc); }On using this, I've noticed that you need to add a width and height on the image for it to display correctly.
Playing with links, I ran into a few problems…
The main one being a background png called in via the css with links on top. The links were there but unclickable, I found out that the background cannot use positioning. By placing this in a containing div with the positioning on solved this problem.On looking into the linking situation further I came across a simpler solution.
Simply by adding:a { position:relative; z-index:1000; }This forced the links in front of the PNG graphics.
Using the PNG as a background comes with a few issues, in IE6 you cannot use background-position or background-repeat. The attached PNG fix allows you to stretch the PNG graphic for repeating backgrounds. As long as you specify a width to this element it will work. The positioning has no work around, IE6 will completely ignore any input from this style. A work around I have used is that you place the PNG image within a div, positioned absolute behind the content div.
Please let me know if you find better ways on using this!
Tags: behavior, css, html, ie6, iepngfix.htc, png | Comments (4)
-
Random text onload using javascript
Posted by Rob Cornish
Use the random.js javascript file in the body of your document.
<script language="Javascript" type="text/javascript" src="random.js"></script>This will load a random line of text within the random.js file each time you visit/refresh the page.
Tags: html, javascript, random, refresh, text | Comments (1)
-
Scrolling div's and anchor links
Posted by Rob Cornish
I've just hit a browser difference that stopped me for a while!
My problem:
Text links outside a scolling div to jump the scroll view to the desired location within the scrolling div.
The scrolling div has the css overflow:auto; with a set height to enable scrolling.
Using normal anchor links and names worked for firefox but not IE6 + IE7, after researching on the net I came across a javascript equivalent.document.getElementById('elmID').scrollIntoView(true);This is how I used the code, by adding this line of code into the anchor tag:
<a href="javascript:document.getElementById('elmID').scrollIntoView(true);">Using this javascript and adding ID's to the areas I needed for scroll view worked a treat!
Tags: css, div, firefox, ie6, ie7, javascript, overflow, scrolling | Comments (3)
-
Css reset
Posted by Rob Cornish
Css reset sheets are very handy! Using Dave Woods tweaked version of Eric Meyer's original reset sheet you can start fresh with better consistency between all browsers.
I have tweaked a few things from Dave's original one. One of them is to use collapsible margins instead of padding top and bottom. It's more of a personal habbit on building sites! So for my reference i've added it in
Download the Css Reset stylesheet.
I always place this at the top of my stylesheet using the @import syntax.
@import "reset.css";Tags: css, html, reset | Comments (0)
-
Inserting flash to webpage
Posted by Rob Cornish
Using the flash.js javascript file in the head of your document.
<script language="JavaScript" type="text/JavaScript" src="flash.js"></script>In the body of your document use:
<script type="text/javascript"> FlashMovie('flashfile.swf', '500', '300'); </script>Set the dimensions to your current flash settings, where 500 is the width and 300 is the height.
Tags: embed, flash, html, insert, javascript, object, transparent | Comments (0)
-
Css hacks
Posted by Rob Cornish
Firstly always design for firefox, for this is the best standards web browser there is!
IE6
* html .myClass { color:#ff0033; }IE7
html>body .myClass { *color:#ff0033; } *:first-child+html #MyDiv { margin:2px; }Using seperate css stylesheets
IE6
<!--[if IE 6]> <link rel="stylesheet" type="text/css" href="/css/ie6.css" /> <![endif]–>IE7
<!--[if IE 7]> <link rel="stylesheet" type="text/css" href="/css/ie7.css" /> <![endif]–>Tags: css, firefox, hacks, ie6, ie7, stylesheets | Comments (0)
