Archive for February, 2005

Detecting pop-up blockers

This is a method of detecting wether your visitors have pop-up blockers such as those provided bundled with Yahoo! Toolbar and Google Toolbar. I have found this technique at JGuru.com.

Please change the value of strNewURL variable with a valid page you have access to. Also, if you want to customize the pop-up window features, change the value of Strfeature variable.

checkPopup = function()
{
var strNewURL = 'tac.html';
var Strfeature = '' ;
var WindowOpen = window.open(strNewURL,"popCheck",Strfeature);

try
{
var obj = WindowOpen.name;
WindowOpen.close();
alert("NO pop-up blockers! Great!");
}
catch(e)
{
alert("You have pop-up blockers enabled!");
}
}

GMail invitations

Oh… I have 50 GMail invitations! If you need a professional, free email service, I suggest you to use GMail but for sign up, you need an invitation. Please contact me to get an invitation!


Running two backgrounds on the same page

Back a few days ago I have encountered a problem at the job when trying to design a layout for one of our customers. What I was trying to do is to have two different backgrounds: one that stretches 100% vertically and one that stretches 100% horizontally.

The page structure was pretty simple, having following divs:

  • header
  • container
  • left
  • center
  • footer

First thing I did was to have a background image that stretches 100% horizontally. That was not an issues.

html, body{background:#fff url(images/fullhorizontally.gif) repeat-x;}

The problem arose when I tried to add to the vertical image to the container.

#container{background:#fff url(images/fullvertically.gif) repeat-y;}

The purpose of this image that stretches 100% verically, was to visually separate the left navigation bar from the page content. What I was expected to see on Mozilla Firefox is that that image will run from the header to the footer. Yet, this didn’t happen. The background image didn’t show at all. And this was because the height of container div was not the same with the height of left. Actually [using webdeveloper extension for Firefox] I realised that the height of container was 0.

So, I had to find another solution. This is what came in my mind: why not having those two backgrounds applied one to the html and one to the body? This is what I did and it worked! I have applied the horizontal background to html and the vertical background to body.

html, body { width: 100%; height: 100%; margin: 0; padding: 0; }
html { background:#fff url(images/fullhorizontally.gif) repeat-x; }
body { background:#fff url(images/fullvertically.gif) repeat-y; }

The way I have put these images is not arbitrary. The following image will explain why I styled the html and body this way:

As you can see, the height of the html is as the height of the user agent window is, while body is as height as the page content is.

I’m sure that there are other techniques to accomplish this, but this one came to me at that moment. And it solved my problem :).


Officially Launched

OK. Isarie’s website is officially launched today!

Yesterday I have managed to buy the domain name and the hosting space.

I’m still working on it though. Some things may not work properly but I hope I will find enough time to fix errors, to update de content and to improve the quality of the website.


sIFR Flash Fonts Library

sIFR is an amazing technique for replacing headings with fancy fonts. This technique doesn’t require the font to be installed on the client machine but requires the developer to edit sifr.fla and export the font in .swf. This is what I did and I have a list of such .swf fonts that can be used free on your website.

What happends if you do not have a Macromedia Flash installation on your computer or, for whatever reason, you can not export your desired font into .swf? This article tries to give you a hand, hopping that you will find the font you need in the list.

If you know that any of these fonts are not free, please contact me as soon as you can so I remove the font from the list.

Enjoy!

PS. Before asking me how to use sIFR tehnique, please make sure you visit sIFR Documentation & FAQ. I do not offer any support [ email, YM or in any other way ].

PS2. Please note that all these fonts are for sIFR 2!


<-- google tracking -->