Why LinkedIn has a nice animated overlay on my web page?

JavaScript
1

Hi,

I have two websites, with normally the same content, the www.thalasoft.com website being the old one and soon to be replaced by www.learnintouch.com

The http://www.thalasoft.com/elearning/exercise/55 displays a nice animated overlay when clicking on the LinkedIn button.

Whereas http://www.learnintouch.com/elearning/exercise/55 displays a crude popup window.

It’d be nice to also have here the nice animated overlay.

I checked and the two have the same jQuery and jQuery UI library versions…

Another strange thing is that the www.learnintouch.com website is able to display the LinkedIn button at all, considering the setup in the LinkedIn Developer website has in the field JavaScript API Domain: the value http://www.thalasoft.com

Changing this value to http://www.learnintouch.com makes the button disappear on the www.thalasoft.com website but has no effect whatsoever on the www.learnintouch.com website.

Any clue ?

Thanks.

Stephane

2

They both just display a standard popup for me in Firefox.

3

Hi Ralph,

Thanks for your reply. For me, on Firefox 8.0 on Linux, the one button from www.thalasoft.com displays a superbly animated overlay going upward above a grayed out background, quite neat ! Whereas the one button from www.learnintouch.com display a regular stock popup.

Cheers,

Stephane

4

It’s a popup for me on both sites in all my Mac browsers. So you may have had something working that your browser has still cached, but which isn’t working for anyone else. Did you specifically put anything in to create that effect?

5

I noticed something… The website www.learnintouch.com has no API Key. I need to fix this first as it’s most likely the cause of the issue.

So, now, after my fix on the code, the website www.learnintouch.com contains the API Key as in:

<script type=‘text/javascript’ src=‘http://platform.linkedin.com/in.js’>
apiKey: vuz7tb04l3xc
authorize: false // Do not auto log in the user but let him click on the “Login with LinkedIn” button
</script>

instead of no key at all.

And the website does not now display the LinkedIn button anymore.

I guess it is because LinkedIn is checking for the correct match between the domain name of the API Key to allow the displaying of the button, which is understandable.

What tricked me, was that LinkedIn, displayed the button, even without any API Key being used in the tag.

So I went to the page https://www.linkedin.com/secure/developer and changed the domain name related to the API Key, from www.thalasoft.com to www.learnintouch.com and sure enough www.thalasoft.com was not displaying the LinkedIn button anymore and www.learnintouch.com was. A consistent and sensible behavior. So, now I understand what was happening.

As a side note, I wonder if in the absence of API Key, LinkedIn should still offer the display of the button. But I’m no judge of that.

Thanks for your support !

Cheers,

Stephane

6

Thanks for the update. :slight_smile: I’m glad you found your way through this … although I still get a popup box on the leanintouch site, and don’t see a linkedin link on the thalasoft site at this stage.

7

No problem. I guess you have the regular popup window instead of the nice animated overlay because of some issue with jQuery on the Apple platform.

8

Heh heh, no Apple user can let that pass! I actually have Windoze too, so tested there, and I just get a popup box there as well.

9

Misread you then :slight_smile:

Strange the it displays as an overlay on Linux Mint 11 Katya with Firefox 8.0.

But on Chromium 14.0.835.202 (Developer Build 103287 Linux) it displays the regular popup window (no overlay there).