Log in

View Full Version : Load SLIDESHOW before Twitter api


vinpkl
10-25-2012, 02:44 PM
hi all

i have this code in the <head></head> for my slideshow



<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery-ui.min.js" ></script>
<script type="text/javascript">
$(document).ready(function(){
$("#slideshow > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});
</script>


and this twitter api code before end of body tag </body>


<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=USERNAME&callback=twitterCallback2&count=2"></script>


THE PROBLEM :

The header Slideshow start only after twitter tweets from the twitter api gets loaded.

The header slideshow has to wait for twitter api to load.

I want that The twitter api should load after the whole page has downloaded so that it doesnt interfere with slideshow.

I want to load and run the header slideshow before twitter tweets api gets loaded.


vineet
jscheuer1
10-25-2012, 08:02 PM
Move this part:



<script type="text/javascript">
$(document).ready(function(){
$("#slideshow > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
});
</script>

to just before the twitter api. But also change it - getting rid of the highlighted parts, so that you end up with this:


<script type="text/javascript">
$("#slideshow > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
</script>
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=USERNAME&callback=twitterCallback2&count=2"></script>
</body>

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.
vinpkl
10-26-2012, 01:42 PM
hi john

This below code works fine when inserted before </body> tag



<script type="text/javascript">
$("#slideshow > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
</script>


But doesnt work when inserted inside <head></head>

why ?

vineet
jscheuer1
10-26-2012, 02:58 PM
. . . code works fine when inserted before </body> tag . . .

. . . But doesnt work when inserted inside <head></head>

why ?

Because in the head, $("#slideshow > ul") doesn't exist yet. Anyways, that's where I told you to put it, just before the twitter api code there, which is (or you said it was) just before the </body> tag.


Move this part . . . to just before the twitter api. But also change it - getting rid of the highlighted parts, so that you end up with this:


<script type="text/javascript">
$("#slideshow > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 5000, true);
</script>
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=USERNAME&callback=twitterCallback2&count=2"></script>
</body>
vinpkl
10-28-2012, 04:52 PM
hi john

a new problem has arisen

if i put these two scripts in my page


<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=USERNAME&callback=twitterCallback2&count=2"></script>


then IE7 shots an error


Internet Explorer cannot open the Internet Site http://mysite.com
Operation aborted


Except IE7, ALL BROWSERS WORK FINE WITHOUT ANY ERROR.

If i remove these two scripts, then there is no error in IE7.

Vineet
jscheuer1
10-28-2012, 05:37 PM
You could ask the twitter api people, like if they have a forum for that or support.

But it really depends upon where 'mysite.com' is coming from. I see you have:



?screen_name=USERNAME

Is that the actual code? If so it might be too generic. Is there a way you can give an actual username?

But it could be coming from somewhere else. Is 'mysite.com' mentioned anywhere in any of the other code for the page?

If so, that should be changed to reflect an actual site, probably that page's site.

If you can't figure any of that out, here's something you can do, remove that code for IE 7 by surrounding it like so:


<!--[if lt IE 8]>
<noscript>
<![endif]-->
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=USERNAME&callback=twitterCallback2&count=2"></script>
<!--[if lt IE 8]>
</noscript>
<![endif]-->

That should prevent IE 7 and less from running that at all. IE 7 won't get the benefits of the twitter api, but unless you can fix the 'mysite.com' problem for IE 7, it probably wouldn't be anyway.

The browser cache may need to be cleared and/or the page refreshed to see changes.

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.
vinpkl
10-28-2012, 05:52 PM
hi john

i replaced Client's Original Twitter ID with "USERNAME" bcoz i didnt wanted to post the client original twitter id.

Otherwise the twitter tweets are displayed fine in firefox, chrome etc except IE7.

the page which gets error is in the folder and not on the root www

the page is located at

domain.com/mysite/index.php

vineet
jscheuer1
10-28-2012, 08:01 PM
If I'm understanding you then, it's probably something in the twitter api. It's looking for that 'mysite' when it should probably be looking for the domain. The fact that this only happens in IE 7 could be a problem with that browser or the fact that only it reports the error. Does the code otherwise work as expected in IE 7?

If it does, we can try to suppress the error. If it doesn't we may as well block the twitter api script using the method from my last post unless the twitter api folks can help you out on it.

BTW, almost no one uses IE 7 any more. If you're stuck with Windows XP, and want IE, there's IE 8, and for Vista on up there's the far superior IE 9.

I'm wondering though. Have you tested in IE 8? I ask because there are not too many errors of this nature in IE 7 that aren't also errors in IE 8. That would be of more concern, but I would still suggest the same general approach.

You see, all browsers except IE 8 and less by default do not report errors. If it's not a fatal error, everything goes on fine and no one is the wiser unless you look under the hood at a console or something. But IE 8 and less by default report almost all errors, regardless of whether or not they're fatal ones. So if it's just the report that bothers you - like the script still works, we can try suppressing the report. If on the other hand the script doesn't work, then we need to remove it for that/those browser(s) where it doesn't work. Since it's the twitter api folks' script, we can't fix it. But they can or may know of a workaround. But as I say we can hold it back from browsers where it causes a problem. Or work at suppressing the error report.

So which is it? Does it break the script or just annoy you because it shows that error?

Oh, one more thing, if this is just a test environment and the finished page will be in the root of the domain, that error might go away once it's all set up like that.