Image relative and absolute path and .htaccess - image

Question

Hy all,
I'm playing around in Codeigneter and trying to make some kind of photo album just for fun ( to understand codeigneter better before i start for real ).
Now did i set up a test website here:
http://foal.scriptsenprogs.nl/
Now the thing is that users can upload an image in the future. And i want that image to be some kind of save...
So if somebody use this link:
http://foal.scriptsenprogs.nl/media/img/albums/1.png
It should be blocked (like it is now).
I've got this line of code in an .htacces file that is placed in /media/img/albums folder
<Directory "http://foal.scriptsenprogs.nl/media/img/albums" >
Options Includes
AllowOverride All
Order allow,deny
Deny from All
</Directory>
I must confess that i have little know-how about .htaccess files, but this seems to work ( the direct url is blocked ).
In my codeIgneter code i use this to add an image to an webpage:
$str .= '<div style="margin-top:20px;"><img width="200px" src="./media/img/albums/' . $imageStuff[$row['album_id']] -> img_id . '.' . $imageStuff[$row['album_id']] -> img_type . '" /></div>';
And before the .htaccess file, it worked. But now it isn't working.
If i check chromes error console i see this error:
GET http://foal.scriptsenprogs.nl/media/img/albums/1.png 404 (Not Found) foal.scriptsenprogs.nl:48
So an 404 Not Found error it is then. But if you check the URL you see that it is conferted to an Absolute URL? But i inserted an Relative URL right?
Any thoughts of you guys on how to fix this?
EDIT 1
In de webroot of the subdomain, i've got the following .htaccess file:
RewriteEngine on
RewriteCond $1 !^(index\.php|images|css|school|media|robots\.txt)
RewriteRule ^(.*)$ /index.php/$1 [L]
EDIT 2
To clarify the question something more...
If your on the website ( http://foal.scriptsenprogs.nl/ ) the image must be showable done by using an relative path. ( like this: <img width="200px" src="./media/img/albums/1.png" /> )
But if your trying to acces the image through an absolute path, it must be blocked ( the link will be something like this then: http://foal.scriptsenprogs.nl/media/img/albums/1.png )

Answer 1

Sometimes CI and relative urls don't play nice together, try using the base_url function
'src="'.base_url().'media/img/albums/'

Answer 2

You could add a new rule to your existing webroot/.htaccess file.
Place the following after the RewriteEngine On line towards the top of your file.
RewriteCond %{HTTP_REFERER} !^http://(.+\.)?yoursite\.com/ [NC]
RewriteCond %{HTTP_REFERER} !^$
RewriteRule .*\.(jpe?g|gif|bmp|png|jpg)$ /404.html [L]
This restricts access to any jpg,gif, etc to the domain http://yoursite.com, other requests are redirected to a 404 page.
NOTE: If you are testing this on a local server, you will be on the same domain as your site so it will most likely seem like nothing is happening.