Splash :: Firma Frans Ernst

ReSpawN · 02-16-2008, 05:26 PM

Hey all!

I've made a temporarily splash website for my dad's company called Firma Frans Ernst. Not that is only design so far, it will use my own CMS system on a later time but this is as far as I've gotten in 3-4 hours.

Give me your thoughts! Oh yeah, it's dutch so what the button text says is: "Firma Frans Ernst is still under construction. Please come again later on. Our apologies for the inconvenience.".

Thanks,
Mark

/edit
I seriously forgot the send the link, *doh*. Here you go;
Firma Frans Ernst :: FransErnst.com :: Specialist in Vogelvoeders, tuin- en balkonplanten

Sam Granger · 02-16-2008, 05:47 PM

Link please :)

ben benieuwd ;)

ReSpawN · 02-16-2008, 06:25 PM

Sorry mate, just posted it.

My bad. I've added some wicked tooltips as well. I couldn't get all the information I wanted into the little space I had. It was either some onMouseOver Javascript or this wicked tooltip. Modified by me of course.

DeMo · 02-16-2008, 08:07 PM

Impressive dude.
You used mootools for those moving images didn't you? :)

ReSpawN · 02-16-2008, 08:59 PM

Yep, I did. Why invent the wheel twice huh?

sketchMedia · 02-16-2008, 09:05 PM

Quote:

Why invent the wheel twice huh?

absolutely, nice work m8 keep it up.

ReSpawN · 02-16-2008, 09:07 PM

Thanks alot your guys, doin' my best huh. Learned a lot from it once again.

Got a good question for you guys tho. Sometimes, when a <link rel...> stylesheet is called uppon, the end of the url to the css is somewhat like this; ...style.css?v=1. How can you make css dynamic like that?

Rendair · 02-16-2008, 11:57 PM

I like the site m8 looks very nice...shame i can't understand what it says

ReSpawN · 02-17-2008, 12:48 PM

Dale, the translation is above!

Sam Granger · 02-18-2008, 07:12 PM

Quote:

Originally Posted by ReSpawN

Thanks alot your guys, doin' my best huh. Learned a lot from it once again.

Got a good question for you guys tho. Sometimes, when a <link rel...> stylesheet is called uppon, the end of the url to the css is somewhat like this; ...style.css?v=1. How can you make css dynamic like that?

Ok, well, this is how I'd do it. I wrote this code up quickly, haven't been able to test so sorry if it doesn't work!!
style.php - this file checks the requested id and includes the right css file. Code can be editted quite easily, not sure where you want to get css data from but I just include css files from a folder called css. The files I include are style[idhere].css eg style1.css.

PHP Code:


			
<?php



/**

 * @author Sam Granger

 * @copyright 2008

 */



header ('Content-type: text/css'); // Display page as css file!



$style = (int) $_GET['v']; // Lets make $style sql safe...



// now, you can include your css from sql, php or just include the file you want to. In this example its just a file include



include './css/style'.$style.'.css'; // if $style = 1, css file that is loaded would be called style1.css



?>

How, to get the php file to display as a css file, we need to do a mod rewrite using htaccess. So make a .htaccess file with the following:

Code:

<IfModule mod_rewrite.c>

	RewriteEngine on

	RewriteRule ^style.css$ style.php [L]

</IfModule>

Now, in your html include your "css file" in header eg:

HTML Code:

<link rel="stylesheet" href="style.css?v=1" media="screen" type="text/css" />

Salathe · 02-18-2008, 07:26 PM

A common practice is to label the stylesheet URLs with version information simply because the developers can update the file but the old one might still be used by a visitor's browser. To refresh the cache, a new URL is used: the incremented version number included.

That said, if you don't mind the overhead, it can be useful to load stylesheets dynamically like Sam mentioned above.

Tanax · 02-18-2008, 09:04 PM

I strongly like this design..
It's clean, and stylish. Simple, but effectful. This is like.. the best type of designing ways I know! Great work! And those slides are awesome.
Can't see you calling them though in your sourcecode :O

It's in the sitetools.js huh? Did you write the function yourself?

ReSpawN · 02-18-2008, 09:40 PM

Quote:

Originally Posted by Tanax

I strongly like this design..
It's clean, and stylish. Simple, but effectful. This is like.. the best type of designing ways I know! Great work! And those slides are awesome.
Can't see you calling them though in your sourcecode :O

It's in the sitetools.js huh? Did you write the function yourself?

I modified it, but I didn't write it.

Thanks a lot by the way, same goes out to all the rest and especially Sam Granger!

Tanax · 02-18-2008, 09:52 PM

Quote:

Originally Posted by ReSpawN

I modified it, but I didn't write it.

Thanks a lot by the way, same goes out to all the rest and especially Sam Granger!

Okey! Which function is it that you make the slide with?

Sam Granger · 02-18-2008, 10:20 PM

mootools demos - Tips for the hovers, for the sliding maybe this: phatfusion : image menu

Sam Granger · 02-18-2008, 10:30 PM

Quote:

Originally Posted by ReSpawN

I modified it, but I didn't write it.

Thanks a lot by the way, same goes out to all the rest and especially Sam Granger!

Geen enkel probleem :) (No probs for you non dutch speakers

)

Tanax · 02-19-2008, 07:55 AM

Quote:

Originally Posted by Sam Granger

mootools demos - Tips for the hovers, for the sliding maybe this: phatfusion : image menu

Ye, I looked at the phatfusion before

Well, still.. I'm .. overwhelmed by the design

GOsh.. :P Who made the design? If you did it yourself, do you know any place where you can download/buy designs like these?

ReSpawN · 02-19-2008, 10:38 AM

Quote:

Originally Posted by Tanax

Ye, I looked at the phatfusion before

Well, still.. I'm .. overwhelmed by the design

GOsh.. :P Who made the design? If you did it yourself, do you know any place where you can download/buy designs like these?

I made it, it's 100% original and copyrighted to my own company (Mark Ernst Productions) and licensed to Firma Frans Ernst.

I used the Fx.Elements plug in from Mootools and edited it using CSS and xHTML. The design has been made with photoshop since it's on a fixed resolution I do not need it to be 100% vector.

The overlay (divoverlib) has been made as well with the Mootools Sam provided.

It gives me great pleasure that you like the design mate. If you want, I can always make a somewhat similar design for you. Of course, not for free.

Haris · 02-20-2008, 09:34 AM

Quote:

Originally Posted by Sam Granger

Ok, well, this is how I'd do it. I wrote this code up quickly, haven't been able to test so sorry if it doesn't work!!
style.php - this file checks the requested id and includes the right css file. Code can be editted quite easily, not sure where you want to get css data from but I just include css files from a folder called css. The files I include are style[idhere].css eg style1.css.

PHP Code:


			
<?php

/**
 * @author Sam Granger
 * @copyright 2008
 */

header ('Content-type: text/css'); // Display page as css file!

$style = (int) $_GET['v']; // Lets make $style sql safe...

// now, you can include your css from sql, php or just include the file you want to. In this example its just a file include

include './css/style'.$style.'.css'; // if $style = 1, css file that is loaded would be called style1.css

?>

How, to get the php file to display as a css file, we need to do a mod rewrite using htaccess. So make a .htaccess file with the following:

Code:

<IfModule mod_rewrite.c>

	RewriteEngine on

	RewriteRule ^style.css$ style.php [L]

</IfModule>

Now, in your html include your "css file" in header eg:

HTML Code:

<link rel="stylesheet" href="style.css?v=1" media="screen" type="text/css" />

Sam, you can directly link to PHP file.

HTML Code:

<link rel="stylesheet" href="style.php?v=1" media="screen" type="text/css" />

The header function on the PHP file makes sure that content is parsed as text/css.

PHP Code:


			
header ('Content-type: text/css'); // Display page as css file!

That does it all. You don't need mod_rewrite unless you want to make it all pretty.

Sam Granger · 02-20-2008, 03:27 PM

Quote:

Originally Posted by Haris

Sam, you can directly link to PHP file.

HTML Code:

<link rel="stylesheet" href="style.php?v=1" media="screen" type="text/css" />

The header function on the PHP file makes sure that content is parsed as text/css.

PHP Code:


			
header ('Content-type: text/css'); // Display page as css file!

That does it all. You don't need mod_rewrite unless you want to make it all pretty.

I know, I just wnated to make it pretty for him, since in his example, he mentioned a ".css" file too, basically the php file but made pretty