Question regarding images…

Sorry if this is the dumb question, or inside the wrong spot, but I will be struggling with what to actually call this problem. I possess a simple website which is designed to help customers look at pictures of products and solutions. I want them every single child click on a url to view a large picture. That Allow me to do easily. What I would like to now, is when this new page pops up, the picture is scaled down enough to fit on the screen and never having to scroll. Then, when you click on this, it blows approximately it’s actual measurement, where you can definitely see a zoomed in version from the product. Here’s a link to what I actually am endeavoring to do:

http: //altawebworks. com/articles/wp-content/uploads/2009/04/wisco-drop-top. gif

When you hover over this particular picture, a magnification device . shows up, and also you can click in making the picture greater. How is this done And even, what is this technique called Thank you beforehand for your time whilst your help!

That’s actually a function of the browser… you don’t have any control over them.
Along with IE, it’s " permit automatic image resizing"… your feature of State-of-the-art Options.

Shipping and delivery know what the particular user’s browse dimensions is (their monitor size).

When you make two sizes of each photo… a thumbnail (tiny) along with a full size (400 pixels high),
you will cover most browser/monitor styles. iPhones, iPods, and many others. will of lessons not work the right way.
Officially, you can see whether a user is employing a PC, iPod, Robot, etc.

There are numerous tricks you can do with PHP GD. When you display a < table> < td> using a page,
you will find out how many pixels wide its by using javascripting. So that a < td> had been made to
often be 100% wide, you’d know how many pixels wide it is. Then, save that value as a cookie
after which you can you use PHP GD for you to resize that image to the proportional height to the next width.
I do not know how smooth that might be. It might need to render a < td>, ascertain the
width after which you can execute a PHP script. There is likely to be an extra article refresh required.

Do this test… copy along with upload the script underneath (call it " display screen. html" ),
then view it with your browser… so it is possible to change window styles.
Click the link at the end of the page to view the current width of the window.

PHP:


< html>
<
head> < title> Test  DIV  width  in  pixels< /title>
<
script>
function 
getOff()

document. getElementById('test');
return 
x. offsetWidth;

< /script>
< style>
#test
margin:   0px  vehicle;

< /style>
< /head>
< body>
< table  style="width: 100%;   peak: 100%;   line: 1px  solid  #000; "> < tr>
< td  id="test"> This  is  the  TD  to  gauge. < /td>
< /tr> < /table>
< br  /> < br  />
< a  href="javascript: alert('offsetWidth  =  '  +  getOff())"> Get  Pixel  Width< /a>
< /body>
< /html>

So I’d envision a script this does this javascript thing when it a lot,
after which you can jumps to a new PHP script that will render the image. The javascript determines
the window dimensions and saves it as a cookie, then that executes the PHP script.
The PHP script pronounces the cookie plus resizes the image depending on the width.

The disadvantage to doing here is the processing time. This would happen every
time someone clicks using a thumbnail. Not really efficient, but useful.

This entry was posted in Web Design and tagged , , , , , , , , , , , , , . Bookmark the permalink.

Related Posts

Leave a Reply

Your email address will not be published. Required fields are marked *