Window gets enlarged but not the Image itself? How to write script so that Image too gets enalrged? Here is the script written As of now: <script language="javascript"><!-- var i=0; function resize() { if (navigator.appName == 'Netscape') i=100; if (document.images[0]) window.resizeTo(document.images[0].width +180, document.images[0].height+150-i); self.focus(); } //--></script> </head> <body onload="resize();">
IMO, you don't need javascript. You can do it using percentages for image width or height. Example: <html> <head> <style type="text/css"> img { width:75% } </style> </head> <body> <img src="yourpicture.jpg"> </body> </html> Code (markup): I've used 75%, but you can use your desired value.
Thanks, its for one image solution, I believe but if there are 50 plus images on e-commerce web site then how to write coding and percentage so that all 50plus images can pop up as enlarged images? Give me another example. Greatly appreciate.
On your site you're using: <img src="yourimage.jpg" border="0" alt="some text" title="other text" width="258" height="136"> Code (markup): Try this: don't set heigh properties. Instead, use only percentage width. Then the image should resize with each window resizing (including user actions): <img src="yourimage.jpg" border="0" alt="some text" title="other text" width="100%"/> Code (markup):
Nope, it doesn't go right or may be missing something. Pop up file is created for all the images and here is my coding again: <script language="javascript"><!-- var i=0; function resize() { if (navigator.appName == 'Netscape') i=100; if (document.images[0]) window.resizeTo(document.images[0].width +180, document.images[0].height+150-i); self.focus(); } //--></script> </head> <body onload="resize();"> So how can it be re-written as per yr suggestion.?
Well, try this code, at least it's working for me: <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html dir="LTR" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Your title</title> <script language="javascript"><!-- var i=0; function resize() { var l_img = new Image(); l_img.src = "yourimage.jpg"; if (navigator.appName == 'Netscape') i=100; window.resizeTo(l_img.width +180, l_img.height+150-i); self.focus(); } //--></script> </head> <body onload="resize();"> <img src="yourimage.jpg" border="0" width="100%" height="100%"/> </body> </html> Code (markup): And the image resizes with each window resizing (including user actions)
not yet, my dear. Here is my complete pop file coding: <?php /* $Id: popup_image.php,v 1.18 2003/06/05 23:26:23 hpdl Exp $ osCommerce, Open Source E-Commerce Solutions http://www.oscommerce.com Copyright (c) 2003 osCommerce Released under the GNU General Public License */ require('includes/application_top.php'); $navigation->remove_current_page(); $products_query = tep_db_query("select pd.products_name, p.products_image from " . TABLE_PRODUCTS . " p left join " . TABLE_PRODUCTS_DESCRIPTION . " pd on p.products_id = pd.products_id where p.products_status = '1' and p.products_id = '" . (int)$HTTP_GET_VARS['pID'] . "' and pd.language_id = '" . (int)$languages_id . "'"); $products = tep_db_fetch_array($products_query); ?> <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN"> <html <?php echo HTML_PARAMS; ?>> <head> <meta http-equiv="Content-Type" content="text/html; charset=<?php echo CHARSET; ?>"> <title><?php echo $products['products_name']; ?></title> <base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER : HTTP_SERVER) . DIR_WS_CATALOG; ?>"> <script language="javascript"><!-- var i=0; function resize() { if (navigator.appName == 'Netscape') i=100; if (document.images[0]) window.resizeTo(document.images[0].width +190, document.images[0].height+160-i); self.focus(); } //--></script> </head> <body onload="resize();"> <?php echo tep_image(DIR_WS_IMAGES . $products['products_image'], $products['products_name']); ?> </body> </html> <?php require('includes/application_bottom.php'); ?>
I think something is to be tweaked here: { if (navigator.appName == 'Netscape') i=100; if (document.images[0]) window.resizeTo(document.images[0].width +190, document.images[0].height+160-i); self.focus(); }
Hello ajs52, l_img.src = "yourimage.jpg"; I don't understand yourimage.jpg, there are not one but 50plus images, so do I do now?