|
|
Posted by Gιrard Talbot on 02/06/07 19:51
Schoolie wrote :
> I'm running OS Commerce and I've pasted the script below that is used
> to "popup" an enlarged image when a user clicks on the image. I need to
> add a scrollbar to the popup but don't know how to.
> <!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
Several parts of doctype declaration must NOT be lowercase:
Common Validation Problems:
Using all lowercase letters in a DOCTYPE
http://www.htmlhelp.com/tools/validator/problems.html.en#doctype-case
Recommended DTDs to use in your Web document.
http://www.w3.org/QA/2002/04/valid-dtd-list.html
Also, using a strict DTD for new webpages makes more sense.
> <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>
> <link type="text/css" rel="stylesheet" href="/css/stylesheet.css">
> <base href="<?php echo (($request_type == 'SSL') ? HTTPS_SERVER :
> HTTP_SERVER) . DIR_WS_CATALOG; ?>">
If this isn't going to be a frame within a frameset, then defining a
<base> is not making sense.
> <script language="javascript"><!--
language is deprecated while type is both backward and forward-compatible.
So here,
<script type="text/javascript">
is perfect
> var i=0;
> function resize() {
> if (navigator.appName == 'Netscape') i=40;
Relying on userAgent string detection is often unreliable, difficult to
manage and wrong. Here, your detection does not even try to detect more
popular browser like Firefox, Mozilla, Seamonkey (Gecko-family) and
others like Safari.
See
Using Web Standards in your Web Pages
4 Developing Cross Browser/Cross Platform Pages
4.1 Browser identification approach (aka "browser sniffing"): not
best, not reliable approach
4.2 Using Object/Feature support detection approach: best and overall
most reliable
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_Pages
Also
A Strategy That Works: Object/Feature Detecting by comp.lang.javascript
newsgroup FAQ notes
http://jibbering.com/faq/faq_notes/not_browser_detect.html#bdFD
Browser detection - No; Object detection - Yes by Peter-Paul Koch
http://www.quirksmode.org/js/support.html
> if (document.images[0]) window.resizeTo(document.images[0].width +40,
> document.images[0].height+120-i);
> self.focus();
The window already has focus; it's useless and unneeded to set its focus
again. The focus() command has been abused before and many Gecko-based
users turn such js-command off in their user preferences setting.
> }
> //--></script>
> </head>
> <body onLoad="resize();">
Everything you need is described in
DOM:window.open
http://developer.mozilla.org/en/docs/DOM:window.open
> <p class="smallText" align="center">
> <?php echo tep_image(DIR_WS_IMAGES . $products['products_image'],
> $products['products_name']); ?>
> <a href="javascript:window.close()"><br><u>Close Window</u>
Please do not create a javascript link to close the window: it's
useless, bad javascript usage, wrong, etc.
4.24 I have <a href="javascript:somefunction()"> ... ?
http://jibbering.com/faq/#FAQ4_24
Top Ten Web-Design Mistakes of 2002
6. JavaScript in Links
http://www.useit.com/alertbox/20021223.html
HTML Techniques for Web Content Accessibility Guidelines 1.0
Avoid creating links that use "javascript" as the URI. If a user is not
using scripts, then they won't be able to link since the browser can't
create the link content.
http://www.w3.org/TR/WCAG10-HTML-TECHS/#scripts-gt
See also section 7.2.1
Never use this form of code for links:
<a href="javascript:window.open(...)" ...>
at
http://developer.mozilla.org/en/docs/DOM:window.open
Alternatively, you can try
Open a sub-window and dynamically DOM-insert an image
http://www.gtalbot.org/DHTMLSection/DynamicInsertionDOMImageInPopup.html
Opening enlarged images of different sizes into a single window
http://www.gtalbot.org/DHTMLSection/EnlargeThumbnail.html
GΓ©rard
--
Using Web Standards in your Web Pages (Updated Dec. 2006)
http://developer.mozilla.org/en/docs/Using_Web_Standards_in_your_Web_Pages
Navigation:
[Reply to this message]
|