Howdy! [ Register | Login | Forums ]

Multichannel eCommerce Software Virtual Coffee Mornings
Coding ebay listing scroll bars

Published on May 2nd, 2012 | by Matthew Ogborne

42

That’s How You Solve Scroll bars in eBay Listings! – Fix eBay’s Duff Code

I covered this previously in an article called “Do you keep seeing scroll bars on your eBay listings?” and as I started to explore this again for someone it became apparent that eBay’s JavaScript code is actually broken.

But before we go any further, I am fully aware that this could be classed as “site interference” by eBay (again this a debatable subject, as I’d class it as fixing a known problem, hence the following notice), so this comes with an explicit warning not to use this code, but for eBay to pick up this article and relay it to the right department (as I know you read this site *coff*).

Unpicking the Code

In the comments of the earlier article ”Do you keep seeing scroll bars on your eBay listings?” I soon worked out why the scroll bars were appearing, the height attribute was not being assigned back to the page correctly.

eBay pass a variable in the URL of the item being viewed, I’m sure you have seen it before it looks like “#ht_1480wt_1396″at the end. What this is, is the height at 1480 and the width at 1396.

Now eBay have got the code in a sub function called “ifr.getSize = function (some code here) “. This function gets the width really well and I have never seen an issue with the width on an eBay listing that has not been the code the seller made.

The code looks like this:

if (document.all) {
h = document.body.scrollHeight;
w = document.body.scrollWidth;
if (oCl.bIE && oCl.iVer >= 9 && document.getElementById('EBdescription')) {
h = document.getElementById('EBdescription').scrollHeight;
var u = document.location.href;
if (u && u.indexOf('&tid=') != -1 && document.getElementById('ngvi_store_id')) {
h = document.getElementById('ngvi_store_id').scrollHeight;
}
h = h + 40;
}
} else {
h = document.body.offsetHeight;
if (oCl.bSafari && oCl.iVer >= 523) {
w = document.body.scrollWidth;
} else {
w = document.body.offsetWidth;
if (window.scrollMaxX !== 0) {
w += window.scrollMaxX;
}
}
}

The line in bold works really well as most listings have a normal width “w = document.body.scrollWidth;“. But the function to get the height, well that’s forked, AKA broken.

It’s Really Obvious Now

And the problem is really obvious now, the code to set the height is trying to get the height straight away and in that attempt lies the problem, you can’t get the accurate height of a page if its not loaded yet!

I’d also like to point out at in the code that is in the iframe, eBay has gone for the right DIV tag, but forgotten to add an ELSE statement after it with some extra code to grab the other event, ie what happens if ngvi_store_id is not found?

So to the function that gets the page sizes (“ifr.getSize”) needs to be slowed down by a few seconds to let the iframe contents (that’s your descriptions) actually load.

Using something like this would work well:

setTimeout("ifr.getSize()", 5000);
rest of the code

But we don’t have control over that code, so the way to get around this is to add a delay and then force the parent url of the listing to have new values for “#ht_” and “wt”.

About 5 seconds to be precise, plenty enough time for the entire description to have loaded and then send back the correct height to the eBay handler so that the scroll bars go away, because we now now what the correct height actually is and have not been so eager to fix the page height.

<script type="text/javascript">
setTimeout("FixMyListingHeight()", 5000);
function FixMyListingHeight(){
var rf = window.document.referrer;
if (oCl.bSafari && oCl.iVer >= 523) {
w = document.body.scrollWidth;
} else {
w = document.body.offsetWidth;
if (window.scrollMaxX !== 0) {
w += window.scrollMaxX;
}
}
h = document.body.scrollHeight;
parent.location.replace(rf + '#ht_' + h + 'wt_' + w);
parent.frames[0].location.replace(sUrl + '&c=' + callerId + '#ht_' + h + 'wt_' + w);
}
</script>

This code is not perfect, but it works on IE, FF and Chrome. In FF the height get’s over amplified, in this case its a good problem, it just means its a long page to scroll through to ask a question :)

What it is missing is some specific code to catch the different browser versions as they appear to report back the height incorrectly across the browsers. That’s beyond my coding skills, I’m just pointing out what the issue is [it needs to be slowed down] and now how to solve it :)

Thought I’d share that with you, as the silly scroll bars have been driving me nuts for months.

This article has been viewed 2122 times since 22th Feb 2012




Want More Plain-English Advice?

Want more eCommerce tips from Matt learned over a decade of working as, for & with the largest marketplace businesses that are in Plain English delivered to your inbox?

If Yes! Enter your details below:

Your Name:
Your Email Address:
PS. I hate spam more than you

42 Responses to That’s How You Solve Scroll bars in eBay Listings! – Fix eBay’s Duff Code

  1. Nick says:

    Still having this issue with our listings.

    Here’s the listing in question I have hosted the script as said and said where it is stored on the server in the JavaScript I put into the product description but it doesn’t affect anything?

    http://cgi.ebay.co.uk/ws/eBayISAPI.dll?ViewItem&item=111147027491

    Any clue?

  2. Ryan Eshelby says:

    Can’t thank you enough for this.

  3. Tried all of your work around, and it doesn’t seem to work for Firefox.

    Chrome = Fine
    IE = Fine

    Firefox just puts the iframe value to:

    Have tried a couple things, but have not managed to resolve this issue in Firefox.

    James

  4. Mark says:

    I’m still seeing this particular problem when i use javascript to display content inside tabs. When i load the page initially no scroll bars appear but as soon as i switch between tabs in my template the annoying scroll bars appear. I’ve tried all sorts to get them to go away ! Any ideas as to what the problem could be http://cgi.ebay.co.uk/ws/eBayISAPI.dll?ViewItem&item=281077916526 p.s. i’m loving your dynamic ebay category module :-).

    • Howdy Mark,

      Ah the tabs at the bottom.

      The only way I have found to stop that from happening is to specify the height of the tabs first, then if the content goes over this it does not make the whole page scroll, just that DIV.

      Try that and you should see it stop adding a scroll bar to the right side and keep it localised to tabbed area.

      Matt

  5. amir says:

    i am applying this store into the ebay but still giving me this error the Description – Your listing cannot contain javascript (“.cookie”, “cookie(“, “replace(“, IFRAME, META, or includes), cookies or base href. how i weill solve this problem. i am not using cookies, not including any js/jquery etc. i have just meta and lots of href links. if i removed the href links then i have lots of links what i will do with those links can you resolved me this issues in a preety way.

    thanks brother
    amir rehman afridi
    rehmanafridi2003@yahoo.com

    • Hi Amir,

      eBay fixed this quite a while ago, if you’re having issues with this, then it’ll be one or more elements in your listing template that are really slow to load and are causing the page to be resized too soon.

      Run your listing through a tool like http://www.webpagetest.org/ and see what is causing the delay. It’ll show the loading times and any red lines are bad, it means that a resource was not found and probably the cause to the scroll bars appearing.

      Matt

  6. Nick Hunter says:

    I just got this problem today using Chrome. It’s OK on Firefox and IE. It’s great that you have found a solution.

    I tried it and eBay says “Your listing cannot contain javascript (“.cookie”, “cookie(“, “replace(“, IFRAME, META, or includes), cookies or base href.”

    I put this script right at the top of my HTML.

    Any idea where I’m going wrong?

    • Nick Hunter says:

      I’ve tried the self hosted script which got past eBay but this has no effect whatsoever.
      Time to give up I think.

      • Howdy Nick,

        I’ve not seen this for quite a while on eBay now, so I’m guessing they have fixed their browser detection script and are adjusting the highest correctly.

        Is there an element in the description that is very slow to load, so that the height cannot be calculated correctly?

        Matt

      • Nick Hunter says:

        Thanks Matt – on Firefox the whole eBay listing loads within 2 or 3 seconds so there must be something in my HTML which is causing the problem with Chrome. My live listing 350619072404 doesn’t have your patch but I’ve tried the patch on Scheduled listings and it makes no difference.

      • Nick Hunter says:

        An update – now Chrome is displaying the listings correctly although I haven’t changed anything. I’ll keep an eye on them.

      • Howdy Nick,

        Ah ha I see what it is.

        You have numerous images and none of them have height & width attributes set on them, thus the browser is left to render the heights which when the browser starts to download the image it does not know.

        As they’re quite larger this takes a few seconds, by that time on a slower connection the timer has gone and the height of the listing has been calculated. But the images are not loaded and then expands the height of the description.

        Add at least the height attribute to the image and this should go away for you.

        Matt

      • Nick Hunter says:

        Thanks Matt. I’ll try that if necessary but as my listings are displaying OK now I’ll leave well alone until the problem arises again.

      • Howdy Nick,

        On the new listings, add the height and width attribute to the images and you shouldn’t see it again :)

        Matt

      • Nick Hunter says:

        Cheers Matt – I’ve now added height and width for all future images so hopefully will never see this problem again.

      • Nick Hunter says:

        Oh dear – too hopeful! Problem is back even with height and width specified – like this:

        <img align=top width='800' height='210' hspace=5 border=6 src='http://homepage.ntlworld.com.xxxxxxxxxx etc.

        Anybody got any suggestions please?

      • Howdy Nick,

        I haven’t, as it’s eBay code that is not right.

        Matt

  7. Thats How You Solve Scroll bars in #eBay #Listings! – Fix #eBays Duff Code – http://t.co/5ElYhLVY

  8. Bruno says:

    I am so frustrated.

    First of all, thanks for your posts here….I’ve been chasing around a solution to this for 2 full days with no luck. I have the simplest of requests… All I want to do is have the entire description in my ebay listing viewable in its entirety.

    Like this listing…. http://www.ebay.com/itm/HIGH-SPEED-HDMI-CABLE-WITH-ETHERNET-1-4-BLURAY-HDTV-PS3-XBOX-10-LENGTH-CHOICES-/300738645830?pt=LH_DefaultDomain_0&var=&hash=item46056b8f46#ht_4433wt_1165

    Ive tried numerous ways of doing this but they all fail. Help!

  9. dave p says:

    Hi Matt

    We are not hosting our own listings. Does this mean that there is no workaround for this problem?

    Tried putting in the code that you provided but just got the same error message as Martin Ngan…

    ‘Your listing cannot contain javascript (“.cookie”, “cookie(“, “replace(“, IFRAME, META, or includes), cookies or base href.’

  10. Thats How You Solve Scroll bars in #eBay #Listings! – Fix #eBays Duff Code – http://t.co/5ZuC0clY

  11. Simon says:

    Tried it last time with no joy, gonna give this another go.

  12. Martin Ngan says:

    hello,

    The same problem happen:

    thank for your solution, but when i use the upper code, ebay show the following text:

    Your listing cannot contain javascript (“.cookie”, “cookie(“, “replace(“, IFRAME, META, or includes), cookies or base href.

    how can i solve it? Thank you very much.

    • Hi Martin,

      Ah its picking up the replace function.

      Download this file http://lastdropofink.co.uk/assets/files/FixMyListingHeight.zip, unzip and add to your own web hosting.

      Then in your listing using this to bring the script through:

      <script type=”text/javascript”>
      <!–
      var fixme = ‘src=”http://yourdomain.tld/FixMyListingHeight.js”‘;document.write(‘<scr’+'ipt type=”text/javascript” ‘+fixme+’”>’);document.write(‘</scr’+'ipt>’);–></script>

      That will do it until they change it themselves. Again this does come with an explicit warning not to use this as the replace function is a banned function for a very good reason, it can be abused.

      Matt

      • Glyn says:

        Thank you that was a good fix and a good solution to a very annoying problem, thanks for taking the time to post this as I was beginning to think I was going nuts – much appreciated.

      • Jeff says:

        Why would I need to download a file? Is there no way to fix this so others can see my auctions? (Something ebay will allow)

        Right now I’m using this below, but it looks bad.

    • Hi Jeff,

      To solve the current issue with the height on some listings the above snippet of code works, download the file and put in your own web hosting and follow the instructions above.

      The CSS is what I suggested in an earlier post, its not really robust as it does not work in all browsers, just like the JavaScript eBay are currently using to set the height of the listing iframe.

      Matt

  13. Andy says:

    I have been annoyed by the scroll bars for ages now but I thought it was just my amazingly slow talk talk broadband!

    Maybe eBay will read this and amend their code, we can only hope!

    Bish

    • Howdy Andy,

      It’s been driving me crazy for ages and this actually works, just slow down the resizing of the frame by a second or 5 and it works.

      It’s not a “perfect” solution as it needs to handle the different browsers properly, but a longer page isn’t really a bad problem compared to scroll bars and the customer having to use an un-natural function within a page.

      Matt

  14. That’s How You Solve Scroll bars in eBay Listings! – Fix eBay’s Duff Code: I covered this previously in an a… http://t.co/grulxATg #in

  15. That’s How You Solve Scroll bars in eBay Listings! – Fix eBay’s Duff Code: I covered this previou… http://t.co/wniksRYE @lastdropofink

  16. That’s How You Solve Scroll bars in #eBay #Listings! – Fix eBay’s Duff Code http://t.co/M4Yqo8xW <= Just posted

Add Comment Register



Leave a Reply

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

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Back to Top ↑

More in Coding, Java & Javascript (9 of 23 articles)
Remove 3rd Party Credit Images from eBay listings


I was asked on Thursday if I knew of a way to remove the "Powered By" logo's from the bottom ...