[Joomla!] Affichage des tabulations dans Beez5

Salut à tous,

Je travaille avec Joomla 1.6 sous le template Beez5

J'ai trois modules à afficher en utilisant les tabulations...
La fonction responsable de l'affichage des tabulations est la suivante:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58

function modChrome_beezTabs($module, $params, $attribs)
{
	$area = isset($attribs['id']) ? (int) $attribs['id'] :'1';
	$area = 'area-'.$area;

	static $modulecount;
	static $modules;

	if ($modulecount < 1) {
		$modulecount = count(JModuleHelper::getModules($attribs['name']));
		$modules = array();
	}

	if ($modulecount == 1) {
		$temp = new stdClass();
		$temp->content = $module->content;
		$temp->title = $module->title;
		$temp->params = $module->params;
		$temp->id=$module->id;
		$modules[] = $temp;
		// list of moduletitles
		// list of moduletitles
		echo '<div id="'. $area.'" class="tabouter"><ul class="tabs">';

		foreach($modules as $rendermodule) {
			echo '<li class="tab"><a href="#" id="link_'.$rendermodule->id.'" class="linkopen" onmouseover="tabshow(\'module_'. $rendermodule->id.'\');return false">'.$rendermodule->title.'</a></li>';
		}
		echo '</ul>';
		//
		//
		$counter=0;
		
		// modulecontent
		foreach($modules as $rendermodule) {
			$counter ++;

			echo '<div tabindex="-1" class="tabcontent tabopen" id="module_'.$rendermodule->id.'">';
			echo $rendermodule->content;
			if ($counter!= count($modules))
			{
			echo '<a href="#" class="unseen" onmouseover="nexttab(\'module_'. $rendermodule->id.'\');return false;" id="next_'.$rendermodule->id.'">'.JText::_('TPL_BEEZ2_NEXTTAB').'</a>';
			}
			echo '</div>';
		}
		$modulecount--;
		echo '</div>';
	} else {
		$temp = new stdClass();
		$temp->content = $module->content;
		$temp->params = $module->params;
		$temp->title = $module->title;
		$temp->id = $module->id;
		$modules[] = $temp;
		$modulecount--;
	}
}

Le code des fonctions javascript tabshow et nexttab est le suivant:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
function tabshow(el) {
	var outerdiv = $(el).getParent();
	outerdiv = outerdiv.getProperty('id');

	var alldivs = $(outerdiv).getElements('div.tabcontent');
	var liste = $(outerdiv).getElement('ul.tabs');

	$(liste).getElements('a').setProperty('aria-selected', 'false');

	alldivs.each(function(element) {
		$(element).addClass('tabclosed').removeClass('tabopen');
		$(element).setProperty('aria-hidden', 'true');
		$(element).setProperty('aria-expanded', 'false');
	});

	$(el).addClass('tabopen').removeClass('tabclosed');
	$(el).setProperty('aria-hidden', 'false');
	$(el).setProperty('aria-expanded', 'true');
	$(el).focus();
	var getid = el.split('_');
	var activelink = 'link_' + getid[1];
	$(activelink).setProperty('aria-selected', 'true');
	$(liste).getElements('a').addClass('linkclosed').removeClass('linkopen');
	$(activelink).addClass('linkopen').removeClass('linkclosed');
}

function nexttab(el) {
	var outerdiv = $(el).getParent();
	var liste = $(outerdiv).getElement('ul.tabs');
	var getid = el.split('_');
	var activelink = 'link_' + getid[1];
	var aktiverlink = $(activelink).getProperty('aria-selected');
	var tablinks = $(liste).getElements('a').getProperty('id');

	for ( var i = 0; i < tablinks.length; i++) {

		if (tablinks[i] == activelink) {

			if ($(tablinks[i + 1]) != null) {
				$(tablinks[i + 1]).onmouseover();
				break;
			}
		}
	}
}

Le problème est que lors du premier accès au site, l'affichage est incorrect(voir image-1 ci-jointe) mais lors du passage de la souris sur n'importe quelle tabulation, l'affichage devient correct(voir image-2 ci-jointe)...

Comment régler ça???

Merci d'avance à tous:aie::aie: