1
nachenko
JQuery, XOOPS and Internet Explorer 6
  • 2007/10/15 14:11

  • nachenko

  • Quite a regular

  • Posts: 356

  • Since: 2005/1/18


OK, IE is a dick, but it's the dick most people use.

I'm using JQuery to make some tabs in a bunch of blocks. A more eye-candy interface and all this. OK, everything is going fine... except on IE 6.

I've used JQuery before in non-XOOPS sites and it works fine, but I build my XOOPS sites using the more complex default theme. I think the problem is that IE is selecting nothing when I write something like:

$('div#example ul').tabs();


I don't even know how to learn what's worng. I've spent this morning looking for known issues regarding IE 6 and Jquery, but did not find anything useful.

This is the site:

http://www.anince.es

Help needed. Thank you.

2
aph3x
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/10/15 14:24

  • aph3x

  • Theme Designer

  • Posts: 834

  • Since: 2004/12/26


jquery is my favorite script of its class simply because it has minimum of code and does more then those using prototype or whatever else.

So far i successfully used it in xmspotlight module and regular XOOPS blocks an example can be seen at http://test.pierdtimp.ro/xblock/
..which later was placed by david in a dummy module and works with no problems in XOOPS

What particular jquery plugin you try to insert in xoops?
Everything I'm not made me everything I am
The Themes

3
nachenko
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/10/15 14:44

  • nachenko

  • Quite a regular

  • Posts: 356

  • Since: 2005/1/18


I'm using Tabs.

It works flawlesly on Firefox, but it fails on IE and Opera (!). This last is more surprising.

Opera error console reads:

Quote:
Inline script thread
Error:
name: TypeError
message: Statement on line 11: Type mismatch (usually a non-object value used where an object is required)
Backtrace:
Line 11 of inline#2 script in http://anince.es/
$(document).ready((function ()
{
$("div.round-container").corner("round 15px");
$("div#bottomCcolumn.tabs > ul").tabs({fxFade : true, fxShowSpeed : "fast"});
$("div#bottomCcolumn > ul").css({backgroundColor : "#990000", color : "#005500"});
}
));


BTW, I'm also using the round plugin, and as usual, it works on FireFox, but not on IE.

4
nachenko
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/10/15 14:48

  • nachenko

  • Quite a regular

  • Posts: 356

  • Since: 2005/1/18


I can't believe it.

This line also makes it fail on IE and Opera:

$(document).ready();

This is the simplest function, the initialization of all stuff. I just updated JQuery two hours ago and haven't modified it.

How is it possible?

5
nachenko
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/10/15 16:33

  • nachenko

  • Quite a regular

  • Posts: 356

  • Since: 2005/1/18


FOrget it, I found a solution. When calling jQuery, don't use $, but simply "jQuery" like this:

jQuery(document).ready();

The problem is that XOOPS own javascript defines a function named $, just like jQuery. One overwrites the other.

6
kris_fr
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/10/15 17:23

  • kris_fr

  • Theme Designer

  • Posts: 1009

  • Since: 2005/12/31


hi,

example in "head" :
<{$xoops_module_header}>

<!-- 
Css du thème -->
<
link rel="stylesheet" type="text/css" media="screen" href="<{xoAppUrl xoops.css}>" />
<
link rel="stylesheet" type="text/css" media="screen,projection,print" href="<{xoImgUrl css/layout-soup.css}>" />
<
link rel="stylesheet" type="text/css" media="screen" title="Color" href="<{xoImgUrl css/style.css}>" />
<
script type="text/javascript" src="<{xoAppUrl /jseffects/jquery/jquery.js}>"></script>
<
script type="text/javascript">
    
JQ = $;  //rename $ function
</script>
<
script type="text/javascript" src="<{xoAppUrl /jseffects/jquery/pluginpage.js}>"></script>
<
script type="text/javascript" src="<{xoAppUrl /jseffects/jquery/toggleElements/jquery.toggleElements.pack.js}>"></script>
<!-- 
Css des scripts -->
<
link rel="stylesheet" type="text/css" media="screen" href="<{xoAppUrl /jseffects/jquery/toggleElements/toggleElements.css}>" />
<
link rel="stylesheet" type="text/css" media="screen" href="<{xoAppUrl /jseffects/jquery/toggleElements/toggleElements2.css}>" />


In the plugins “.js”, to think of rename the “$” by “JQ”

@++

7
nachenko
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/10/16 10:15

  • nachenko

  • Quite a regular

  • Posts: 356

  • Since: 2005/1/18


Thanks, Kris.

OK, we have two solutions that seem to work. I'd like some feedback about both.

8
suico
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/11/15 14:13

  • suico

  • Friend of XOOPS

  • Posts: 374

  • Since: 2003/7/24


I use jquery a lot and in my module yogurt it is very used

Just had a look at xoops.js and yes it uses a function called $

I can change my calls to the function $ to jquery or JS as kris suggested yes but I hadn t any problems till now of compability, maybe cause I declared my js through $xoTheme->addScript ?

Is there a cascade system like css for javascript ? Or will I have problems in all cases just for redeclaring the function with the same name?

A sad day :(

And please XOOPS core developers think about changing the core function $ to anything else but we can t have an incompability with such a great script library as jquery is.

Would like to hear more about it.
Yogurt Social Network Service
Visit: http://www.marcellobrandao.eti.br/

9
phppp
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/11/15 14:30

  • phppp

  • XOOPS Contributor

  • Posts: 2857

  • Since: 2004/1/25


Before it is officially changed to xoops$, please use it as a hack.

10
nachenko
Re: JQuery, XOOPS and Internet Explorer 6
  • 2007/11/15 17:07

  • nachenko

  • Quite a regular

  • Posts: 356

  • Since: 2005/1/18


I found a very nice workaround. Put it in the wiki.

In jQuery, the $ function is just an alias. Just use the original jQuery function. So, instead of...

$(document).ready(...

write...

jQuery(document).ready(

That easy.

Login

Who's Online

56 user(s) are online (27 user(s) are browsing Support Forums)


Members: 0


Guests: 56


more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Aug 31
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits