|
|
Posted by Onideus Mad Hatter on 06/27/05 11:44
On Sun, 26 Jun 2005 23:08:47 -0700, newcastle <dan@dan.nospam> wrote:
>Onideus Mad Hatter wrote:
>> I contributed my thoughts to the only article in existence (as far as
>> Google can find) regarding liquid images:
>> http://www.michelf.com/weblog/2005/liquid-image/
>>
>> He, he, he...it seems that once again I have made web design history.
>>
>> For those who aren't retarded like Starshine Moonbeam aka MORONbeam,
>> here's teh actual code segments:
>>
>> HTML File
>> :<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Fuzzy" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
>> : <html>
>> : <head>
>> : <title>Histology Tutorial</title>
>> : <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"/>
>> : <meta http-equiv="imagetoolbar" content="no"/>
>> : <meta name="keywords" content="Backwater Productions, histology, WWCC, Walla Walla"/>
>> : <meta name="language" content="en-us"/>
>> : <meta name="distribution" content="GLOBAL"/>
>> : <meta name="copyright" content="Backwater Productions 2005"/>
>> : <meta name="author" content="Backwater Productions"/>
>> : </head>
>> : <body style="margin-left:0; margin-top:0; margin-right:0">
>> : <script language="JavaScript" type="text/javascript" src="internals.js"></script>
>> : </body>
>> : </html>
>>
>> JavaScript File
>> : document.cookie = "farfoos=" + document.body.clientWidth;
>> : document.write("<img src='index.php'>");
>>
>> PHP File
>> :<?php
>> :
>> :$filename = 'shapes.png';
>> :
>> :list($width, $height) = getimagesize($filename);
>> :$new_width = $HTTP_COOKIE_VARS["farfoos"];
>> :$new_height = $height / $width * $new_width;
>> :
>> :$image_p = imagecreatetruecolor($new_width, $new_height);
>> :$image = imagecreatefrompng($filename);
>> :imagecopyresampled($image_p, $image, 0, 0, 0, 0, $new_width, $new_height, $width, $height);
>> :
>> :imagepng($image_p);
>> :?>
>>
>> --
>>
>> Onideus Mad Hatter
>> mhm ¹ x ¹
>> http://www.backwater-productions.net
>
>Is there a way to make the image resize without refreshing the browser?
The best I've come up with in the past hour is to alter the JavaScript
file like this:
: document.cookie = "farfoos=" + document.body.clientWidth;
: document.write("<img id='shapes' src='index.php'>");
:
: window.setInterval("check()", 1);
: var width = document.body.clientWidth;
:
: function check()
: {
: cwidth = document.body.clientWidth;
: if ( width != cwidth )
: {
: document.cookie = "farfoos=" + cwidth;
: document.getElementById("shapes").src='index.php';
: setTimeout("width = cwidth;",250);
: }
: }
The problem though is that you have to start off windowed and then
make it bigger for it to work. If you go from big to small it won't
resize because it just puts in a scroll bar and the clientWidth stays
the same. I tried to put in a scrolling:hidden style into the main
HTML file but then the whole thing didn't work at all so I'm not
completely sure, it may not be possible without a refresh.
Although impossible is usually just another way of saying "I don't
have time". For my own purposes it works the way I want it to. The
next thing I'll probably do with it is to make it so that it can
handle PNG alpha transparencies as the current version does not and
that's a function that I require for my next major project.
--
Onideus Mad Hatter
mhm ¹ x ¹
http://www.backwater-productions.net
[Back to original message]
|