Author |
Topic |
|
patrickong
VP-CART New User
Singapore
58 Posts |
|
bluesky
VP-CART Super User
304 Posts |
Posted - January 27 2004 : 21:24:24
|
Hey that a really cool feature ..... first time I have seen that on an ecommercw website before .........very effective.............roll on VPASP
|
|
|
siraj
VP-CART New User
USA
194 Posts |
Posted - January 28 2004 : 00:12:14
|
I am afraid that the loading the page will take more time when you have more products to display. Mouse over need to bring the all the images upfront to show up when mouse moves over actually. If you are doing for couple of products its alright but if you ar doing for all products, forget it. Customer will leave the site before its loads up especially when they use dial up!!!!
[email protected] |
|
|
patrickong
VP-CART New User
Singapore
58 Posts |
Posted - January 28 2004 : 12:09:17
|
Loading a small image is ok...
If you try shopping that sample site, you won't find it slow at all. Try to see all their products.. it's not slow. It's fast!
|
|
|
GTM
VP-CART New User
USA
122 Posts |
Posted - January 28 2004 : 17:54:08
|
It looks like it is using this script to call the image.
<script language="JavaScript"> function ModelWindow(jsTarget, jsWidth, jsHeight) { if (jsWidth == null) { jsWidth = 310; } if (jsHeight == null) { jsHeight = 345; } window.open(jsTarget,"model","width=" + jsWidth + ",height=" + jsHeight + ",titlebar=no,toolbar=no,menubar=no,location=no,scrollbars=no,resizable=no"); }
function CartWindow(jsTarget, jsWidth, jsHeight) { if (jsWidth == null) { jsWidth = 600; } if (jsHeight == null) { jsHeight = 500; } window.open(jsTarget,"cart","width=" + jsWidth + ",height=" + jsHeight + ",titlebar=no,toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=yes"); }
function showBlowup(divID, imageID) { if(document.layers) { var divObject = document.layers[divID] var imageObject = document.images[imageID] divObject.pageX = imageObject.x divObject.pageY = imageObject.y divObject.visibility = "visible" } else if(document.all) { var divStyle = document.all.item(divID).style var imageObject = document.images[imageID] divStyle.posLeft = (window.event.clientX - window.event.offsetX) divStyle.posTop = (window.event.clientY - window.event.offsetY + document.body.scrollTop) if (navigator.appVersion.indexOf("Mac") >= 0) { divStyle.posTop -= document.body.scrollTop } divStyle.visibility = "visible" } }
function showBlowupInNewWindow(imageFileURL,width,height) { // Workaround for Navigator 6 windowOptions = "directories=0,menubar=0,personalbar=0,status=0,resizable=1,width=" windowOptions += width + ",height=" + height window.open(imageFileURL,"nav6workaround",windowOptions) }
function hideBlowup(divID) { if(document.layers) { var divObject = document.layers[divID] divObject.visibility = "hidden" } else if (document.all) { // Use IE DHTML var divStyle = document.all.item(divID).style divStyle.visibility = "hidden" } }
</script>
Greg
|
|
|
siraj
VP-CART New User
USA
194 Posts |
Posted - January 28 2004 : 19:58:11
|
I think you are blowing up the thumb nail image to the different size. Id that the case, your image will be pixellated. Like I said earlier, if you showing a couple of images per page, thats ok. But guess, you are showing 20 product per page in shopdisplayproducts, what could be the load time? GOOD LUCK. SJ.
[email protected] |
|
|
Mark Priest
VP-CART Expert
United Kingdom
580 Posts |
Posted - January 29 2004 : 12:38:51
|
Yep thats the code.
They do use a different image for the larger pic.
You can see it here.
<a href="javascript:void(0)" onMouseOver="showBlowup('bigpic','prodpic')"> <img name="prodpic" src="/ecourts/Assets/product_images/410496.jpg" width="100" height="88" border="0" alt="EPSON C900 LASER PRINTER"> </a> <br> <small>Move mouse over for larger image</small> <br><br> <div id="bigpic" style="position:absolute;height:300;visibility:hidden;margin:-2px;"> <table cellspacing="0" cellpadding="0" border="1"> <tr> <td> <a href="javascript:void(0)" onMouseOut="hideBlowup('bigpic')" onClick="hideBlowup('bigpic')"> <img alt="EPSON C900 LASER PRINTER" src="/ecourts/Assets/larger_images/410496_b.jpg" border="0"> </a>
There just using some rather nice DHTML but it would be nice to see what browsers / versions it runs in!
Regards,
Mark |
|
|
GTM
VP-CART New User
USA
122 Posts |
Posted - January 29 2004 : 15:49:54
|
When determining which browsers it does work you could use a sniffer code that would create a fork for the different browsers and versions.
Ex. http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html
I have to agree with siraj that using that code on the shopdisplayproducts could be detrimental to the load time on a slower connection. You would probally have to use it with the shopexd.asp which would only be the one image.
Greg
Edited by - GTM on January 29 2004 15:50:20 |
|
|
patrickong
VP-CART New User
Singapore
58 Posts |
Posted - January 30 2004 : 20:07:22
|
Hi All,
Don't you think that using with a 56K modem, nothing is fast. Be it a lengthy products page or any graphically rich page?
So an innovative sugestion to enhance the VP-ASP is an auto-popup image but we could let the merchants select whether they want the image to pop-up or not if they feel that their target audience will not be affected by downloading time if the majority of them uses 56K modem right?
Patrick Ong
|
|
|
patrickong
VP-CART New User
Singapore
58 Posts |
Posted - January 30 2004 : 20:12:49
|
Hi,
Ok, I think I've the answer to the downloading question on a page with say 20 products in a row.
If you go to http://www.ecourts.com.sg/eCourts/Default.asp, you'd realise that actually the blowup will only appear in the Extended Product Description page... so the menu on the left that shows a few product varieties do not actually get the pop-up image until they click to see the detailed product description.
So, we could put this code in the Extended Product Description page only so that only 2 images are being downloaded when needed and not all at once.
What do you guys feel?
Patrick Ong
|
|
|
|
Topic |
|