ebay-listing-scroll-bars

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 scrollbars on your eBay listings?” I soon worked out why the scrollbars 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 subfunction 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.

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 it’s 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 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, it’s a good problem, it just means it’s 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.

45 replies
  1. Darren
    Darren says:

    Hi Matt,

    I have downloaded the file put it in the hosting and inserted this in the html but it does not work. My dreamweaver shows a syntax error for the 2nd line. What an I doing wrong?

    <!–
    var fixme = ‘src=”http://yourdomain.tld/FixMyListingHeight.js”‘;document.write(‘’);document.write(‘’);–>

    Reply
  2. James Simpson
    James Simpson says:

    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

    Reply
  3. Mark
    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 :-).

    Reply
    • Matthew Ogborne
      Matthew Ogborne says:

      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

      Reply
  4. amir
    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

    Reply
    • Matthew Ogborne
      Matthew Ogborne says:

      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

      Reply
  5. Nick Hunter
    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?

    Reply
      • Matthew Ogborne
        Matthew Ogborne says:

        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
        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
        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.

      • Matthew Ogborne
        Matthew Ogborne says:

        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
        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.

      • Nick Hunter
        Nick Hunter says:

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

  6. Bruno
    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!

    Reply
  7. dave p
    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.’

    Reply
  8. Martin Ngan
    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.

    Reply
    • Matthew Ogborne
      Matthew Ogborne says:

      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

      Reply
      • Glyn
        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
        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.

    • Matthew Ogborne
      Matthew Ogborne says:

      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

      Reply
  9. Andy
    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

    Reply
    • Matthew Ogborne
      Matthew Ogborne says:

      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

      Reply

Trackbacks & Pingbacks

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

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

  3. 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

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

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

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

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