IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

EDI, CMS, Outils, Scripts et API PHP Discussion :

Affichage des tabulations dans Beez5


Sujet :

EDI, CMS, Outils, Scripts et API PHP

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre averti
    Inscrit en
    Août 2009
    Messages
    17
    Détails du profil
    Informations forums :
    Inscription : Août 2009
    Messages : 17
    Par défaut 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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    Images attachées Images attachées   

Discussions similaires

  1. Réponses: 0
    Dernier message: 15/04/2010, 11h35
  2. []Problème d'affichage des enregistrements dans un DataReport
    Par GeniuZ dans le forum VB 6 et antérieur
    Réponses: 8
    Dernier message: 05/01/2005, 16h52
  3. [C#] Affichage des lignes dans un tableau.
    Par maldufleur dans le forum ASP.NET
    Réponses: 4
    Dernier message: 21/04/2004, 11h28
  4. Réponses: 1
    Dernier message: 06/03/2003, 11h57
  5. Taille des tabulations dans un TMemo ?
    Par dergen dans le forum Composants VCL
    Réponses: 2
    Dernier message: 07/01/2003, 19h38

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo