Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

IE title changes to <afterHash> if the page has a url with '#' , and has flash/swf embedded in it

Tags:

The issue is, if IE (6.0+) , has flash content embedded in it, and the url of the page has a # somewhere in it, then when the flash content loads ,or if the user interacts with it, then the title of the window, changes to the content that is places after hash.

e.g http://adobeflashwebsite.com/index.html#somediv

Then the title of the page changes to 'somediv' , the moment a user will click on flash content, or many a times even the moment the flash content loads.

This happens only in IE.

This below is a very specific case I was facing:

The following is the environment I am facing issues with:

  1. Shinding engine to show an iGoogle like page
  2. Sammy.js
  3. Gadgets rendering flash/swf

The issue here is, no matter which plugin I try to embed flash with, I end up having the following problem

  1. When the flash loads completely, it appends something like #tab/xx , which actually is a string used by sammy to store the last navigational history within the page
  2. When, a user starts interacting with the flash, then the title is completely removed and only #tab/xx remains as the title.
  3. When a gadget is refreshed, even then there is issue like #2.

Could someone suggest, what the issue could be? Most probably is it related to sammy.js, as iGoogle doesn't have that issue.

like image 730
Neeraj Avatar asked Dec 30 '10 12:12

Neeraj


3 Answers

The following workaround is the only way (till now) , that I got nearest to solving the issue:

var isIE11OrGreater = !!(navigator.userAgent.match(/Trident/) && !navigator.userAgent.match(/MSIE/));
if (!isIE11OrGreater) {
    var originalTitle = document.title.split("#")[0];    
    document.attachEvent('onpropertychange', function (evt) {
       if(evt.propertyName === 'title' && document.title !== originalTitle) {
        setTimeout(function () {
           document.title = originalTitle;
        }, 1);
    }
});

}

//Incase the developer wants to change the title manually, instead of directly using     //document.title=newtitle, he will need to use changeTitle(newTitle)
    function changeTitle(newTitle)
    {
        originalTitle = newTitle;
        document.title = newtitle;
    }
like image 106
Neeraj Avatar answered Oct 12 '22 23:10

Neeraj


It is IE bug:

  • http://bugs.adobe.com/jira/browse/FP-240 (includes couple of workarounds)
  • http://www.mail-archive.com/[email protected]/msg14509.html
  • http://code.google.com/p/swfobject/issues/detail?id=293

If you are using sammy's title method you could delay the execution a bit to make it behave on IE.

setTimeout(function() {
    context.title('Some title');
}, 1000);

This won't solve it really, but I have noticed that a little delay helps IE sometimes.

like image 32
Heikki Avatar answered Oct 12 '22 23:10

Heikki


I'm not really familiar with sammy.js but:

1) the Flash object is somehow 'taking ownership' of the title property.

OR

2) sammy.js is clearing the title value on HTML losing focus aka Flash gaining it (less likley and don't know why would someone do that)

If 1) -> define the title property in the Flash object itself (not a Flash user, dunno if it can be done easily)

If 2) -> the javascript is dumping a variable string value connected to the title property?

SUGGESTION:

Enclose your flash object in a new <div> element, assigning the <div> a .click() event handler that changes the title property of a document. Try this:

$('title').text('YourTitleHere');
like image 24
crowicked Avatar answered Oct 13 '22 00:10

crowicked