TYPO3 Reea Blog

This will be shown to users with no Flash or Javascript.

Încărcare pagini cu AJAX

In situația în care vrem sa folosim pe pagină un slider pentru imaginile de fundal sau un mp3 player care sa functioneze in continuu, fara a se reincace pagina si sa sara mp3 payerul la primul mp3 sau sliderul sa o ia de la inceput de fiecare data, se pote folosi solutia de mai jos.

Ca sa functioneze sriptul de mai jos, meniul trebuie sa aiba class="menu".
Contentu-ul sa fie pus in 2 div-uri. Primul div cu class="content" in care alt div cu class="innerContent".

Se pune in root template:


page.headerData.12 = TEXT
page.headerData.12.value (
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){			

function getAjax(id,the_obj) {
  var link = $(the_obj).attr('href');
  $('.innerContent').fadeOut('fast', function() {
	$('.content').load(link+' .innerContent', function(){
	  $('.innerContent').fadeIn('fast', function() {   
		$('.menu ul').find('li').attr('class', '');
		$('#id_'+id).parent().attr('class', 'active');
	  });  
	});
  });
}
</script>
)

Meniul care apeleaza functia de AJAX


lib.mainMenu=HMENU
lib.mainMenu.special= list
lib.mainMenu.special.value = 7,2,3,4,5

lib.mainMenu{
  1 = TMENU
  1.expAll = 1
  1.noBlur = 1
  1.wrap=<ul>|</ul>

  1.NO = 1
  1.NO{
  stdWrap..htmlspecialchars = 1
  stdWrap.field = nav_title // subtitle // title

  ATagTitle.field = title
  ATagParams = onclick="getAjax({field:uid}, this); return false;" id="id_{field:uid}"
  ATagParams.insertData = 1

  allWrap=<li>|
  wrapItemAndSub = |</li>
    }
    1.ACT < .1.NO
    1.ACT = 1
    1.ACT.allWrap=<li class="active">|
    1.ACT.wrapItemAndSub = |</li>

  2 < .1
  2.NO.allWrap=<li>|
  2.NO.wrapItemAndSub=|</li> 
  
  2.ACT < .1.NO
  2.ACT = 1
  2.ACT.allWrap=<li class="active">| 
  2.ACT.wrapItemAndSub = |</li>

}


blog comments powered by Disqus

In aceasta sectiune

Scripturi folosite uzual pentru configurarea site-urilor. Pentru orice referinta noua, sau comentariu, se poate folosi zona de page coments a fiecarei pagini, sau puteti trimite un email la adresa calin@reea.net.

Premium Sponsor

TYPO3camp Mallorca 14/09/12-16/09/12