Knowledge Base support case for Likno Web Tooltips Builder, abstracted and stripped of all user’s private info.


Initial Email From: Diane
Initial Email Subject: Tooltip Builder
Support Case Month: September 2012

Hi Kostas, 
We’re having trouble with a tooltips .js file.  The webpage loads, but the tooltips are displaying below the body of the page (see attached file).  If we go to another page and then return to the page with tooltips, the tooltips display in their correct position.  As with a problem we had with accordion builder, it seems dependent upon how other scripts load in the page. 
Can you provide a similar fix for the tooltips display problem?  That is, is there a tooltips function we can call to trigger a plain refresh … or is there another fix you can recommend?

With my thanks for your assistance,
Diane

Reply From: Likno Customer Support

Dear Diane,

I am afraid that I did not receive any attachments with your mail. Do you have the problem in an online page? if so, it will be better for me to see that page directly.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Diane

Hi Kostas,

My apology that the file wasn’t attached.  Please find it attached to this email.  And, yes, the problem can be viewed online at {URL REMOVED}

If you roll over the first item in the “Recorded Webinars” column, or the first or fourth item in the “White Papers” column, you should see a tooltip displayed to the right of the item.  However, they’re displaying at the bottom of the page and aren’t apparent because you have to scroll down to see the tooltip.

Thanks again, Kostas …

Best regards,
Diane

Reply From: Likno Customer Support

Dear Diane,

I checked your online page and was able to see the problem in IE (it seems to work fine in all other browsers).

It seems that the problem is caused by the multiple jQuery libraries (of older versions) that you are loading.

My suggestion is to minimize this (it will also speed up your page although probably not noticeably) by loading only the jQuery that comes with our products, which is up to date.

Also, as I said before, you are loading jQuery and several of its plugins twice in your page. You should merge these to a single loading in order to avoid possible conflicts.

To do this, you need to find the following lines (starting in line 17) in your page:

<script language="javascript" type="text/javascript" 
        src="/includes/JavaScript/jquery.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.core.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.draggable.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.resizable.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.dialog.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/jquery.tools.min.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/jquery.ldc.js">
</script>

<script language="JavaScript" type="text/JavaScript">
        var $ldc = jQuery.noConflict(); 
</script>

And replace them with these:

<script language="javascript" type="text/javascript"
        src="files/ftp/bnymas/tooltips/jquery.js">
</script>

<script language="javascript" type="text/javascript"
        src="files/ftp/bnymas/js/likno-scripts/jquery.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.core.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.draggable.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.resizable.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/ui.dialog.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/jquery.tools.min.js">
</script>

<script language="javascript" type="text/javascript"
        src="/includes/JavaScript/jquery.ldc.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/modalDialog.js">
</script>

<script type="text/javascript" src="/controlPanel/scripts/common.js ">
</script>

<script language="JavaScript" type="text/JavaScript">
        var $ldc = jQuery.noConflict(); 
</script>

Then you should remove the second set of lines that currently start in line 99:

<script type="text/javascript" src="/includes/JavaScript/jquery.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/jquery-1.3.2.min.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/ui.core.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/ui.draggable.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/ui.dialog.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/ui.resizable.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/jquery.tools.min.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/jquery.ldc.js">
</script>

<script type="text/javascript" src="/includes/JavaScript/modalDialog.js ">
</script>

<script type="text/javascript" src="/controlPanel/scripts/common.js ">
</script>

After doing the above, everything should work fine in your page in all browsers including IE.

Finally, again in order to make your page one bit more efficient, I recommend that you compile and upload all Likno products under the same folder (typically “likno-scripts”) to minimize the uploaded files and hence the page loading time.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Diane

Dear Kostas,

                I can’t thank you enough for your thorough review and suggestions.  Unfortunately, the duplicate loading of older jQuery is being done by the Learning Management System we’re running this application under.  I have no control over this loading.  All I can do is to try to find another way around the problem.  Do you have another “next best thing to do” idea that might get us around the problem?

My sincere thanks again,

Diane

Reply From: Likno Customer Support

Dear Diane,

The next best thing would be to add the following line before loading the other jQuery scripts:

<script language="javascript" type="text/javascript"
        src="files/ftp/bnymas/js/likno-scripts/jquery.js">
</script>

In order for this to work, you need to insert it in the <head> after loading the “ldcAJAXmoz.js” and before the first set of jQuery scripts. Do you have access to do this?

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Likno Customer Support

It also just occurred to me just now that (if you have access) you can simply overwrite the “jquery.js” file under the “includes/JavaScript” folder with the “jquery.js” from our own compiled files.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Diane

Hi Kostas,

                Unfortunately, the Learning Management System loads all of its scripts before it loads my scripts and page content … there’s no way for me to get ahead of it.  And, while I can access the LMS “includes/JavaScript/jquery.js” file, I can’t overwrite it.  The best solution I can come up with is to load a javascript function ahead of the tooltips script loading which replaces the older jquery.js with the tooltips jquery.js version.  The script I’m loading ahead of tooltips follows.  If you have any better ideas, I’d appreciate your input.

With my thanks again … and now the script which will let me dynamically replace either a .js file or a .css file:

<script language='JavaScript' type='text/javascript'>
function createjscssfile(filename, filetype){
if (filetype=="js"){ //if filename is a external JavaScript file
  var fileref=document.createElement('script')
  fileref.setAttribute("type","text/javascript")
  fileref.setAttribute("src", filename)
}
else if (filetype=="css"){ //if filename is an external CSS file
  var fileref=document.createElement("link")
  fileref.setAttribute("rel", "stylesheet")
  fileref.setAttribute("type", "text/css")
  fileref.setAttribute("href", filename)
}
return fileref
}
function replacejscssfile(oldfilename, newfilename, filetype){
var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none" //determine element type to create nodelist using
var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none" //determine corresponding attribute to test for
var allsuspects=document.getElementsByTagName(targetelement)
for (var i=allsuspects.length; i>=0; i--){ //search backwards within nodelist for matching elements to remove
  if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(oldfilename)!=-1){
   var newelement=createjscssfile(newfilename, filetype)
   allsuspects[i].parentNode.replaceChild(newelement, allsuspects[i])
  }
}
}
replacejscssfile("/includes/JavaScript/jquery.js", "files/ftp/bnymas/tooltips/jquery.js", "js") //Replace all occurences of "oldscript.js" with "newscript.js"
</script>

Diane

Reply From: Likno Customer Support

Dear Diane,

Does this work? I tested it in my IE9 but I do not see it working…

Are you sure you cannot overwrite the file? Is it not on your server? If it is, even if it is read-only you should be able to change this and then overwrite it.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Diane

Hi Kostas,

I’ve been testing in IE8 … and no, it doesn’t work 100% reliably … but what does work is if I go to another web page and then use the browser’s back button to return to this page, the tooltips work reliably … does this give you any more insight?

The ”includes” folder is not available to me via ftp so that I can overwrite the LMS jquery.js file.  I can view or save the current v1.3.2 file with the url {URL REMOVED}, but I don’t know a way to actually overwrite it.  I can ask the LMS Support Team to give me access or to update the jquery.js file from v1.3.2 to v1.6.2 but I’m not sure if they will.  I’d prefer to find a work around if possible.

Thanks for your perserverance, Kostas …

Best,

Diane

Reply From: Likno Customer Support

Dear Diane,

Well, since their scripts all work fine with the latest jQuery it would not be unreasonable to ask them to update their jQuery file. They should do this for all users anyway!

I believe the minimum jQuery version to use is 1.4.2, as it was a major update and most of the things added back then are still in use.

You should give it a shot and see what they have to say. After all this conflict will occur with many more of their users and with many jQuery products.

Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter

Reply From: Likno Customer Support

Thanks, Kostas …

I’ll give it a try and let you know how I make out.

Best regards,

Diane