[jquery][ajax] zmiana diva bez przeładowania strony - problem Opcje

[ostrylg]

Witam,

mam pewien problem którego nie potrafię rozwiązać.

Oto link do mojej strony strona z problemem

Skorzystałem ze skryptu z tej strony :

A Simple AJAX Driven Website

Wszystko ogólnie działa poprawnie, jednak problem pierwszy polega na tym że chcę ustawić stronę "Wydarzenia" jako domyślną, tak by była ładowana automatycznie przy włączeniu strony, skorzystałem z podpowiedźi autora skryptu by podmienić w 3 linijce kod

var data = 'page=' + document.location.hash.replace(/^.*#/, '');

na

if (document.location.hash=='') var data = 'page=' + encodeURIComponent('#page1');
else var data = 'page=' + encodeURIComponent(document.location.hash);

replace the 3rd line of getPage() function with that, you can choose which page you wanna load as well.

jednak to nie pomaga, nadal na początku nie jest wyświetlana żadna strona. Tak wygląda kod php ze strony przeglad.php który jest odpowiedzialny za zawartość divów :

[PHP] pobierz, plaintext 
 
<?php
//Get the page parameter from the url
 
if($_GET['page'] == "#kalendarium")  {
 
     ?>
<br>
<font color="black"><center>Kalendarium
 
<?php }
//Get the page parameter from the url
 
if($_GET['page'] == "#fotorelacje")  {
 
    ?>
 
<br>
<font color="black"><center>Fotorelacje
 
<?}
if(($_GET['page'] == "#wydarzenia") or ($_GET['page'] == ""))  {
 
?>
 
                <div id="slider4" class="sliderwrapper">
 
<div class="contentdiv" style="background: url(foto/gdansk.jpg) center left"><div class="day_news_title"><a href="index.html">Lorem ipsum </a><p style="width:380px;font-weight:normal;margin-top:4px"><a href="index.html" class="desc">Lorem ipsum<img src="gfx/arrows1.png" style="margin-left:4px"/></a></p></div>
</div>
 
<div class="contentdiv" style="background: url(foto/warszawa.jpg) center left"><div class="day_news_title"><a href="index.html">Lorem ipsum Lorem ipsum</a><p style="width:380px;font-weight:normal;margin-top:4px"><a href="index.html" class="desc">Lorem ipsum<img src="gfx/arrows1.png" style="margin-left:4px"/></a></p></div>
</div>
 
<div class="contentdiv" style="background: url(foto/poznan.jpg) center left"><div class="day_news_title"><a href="index.html">Lorem ipsum Lorem ipsum Lorem ipsum</a><p style="width:380px;font-weight:normal;margin-top:4px"><a href="index.html" class="desc">Lorem ipsum<img src="gfx/arrows1.png" style="margin-left:4px"/></a></p></div>
</div>
 
<div class="contentdiv" style="background: url(foto/wroclaw.jpg) center left"><div class="day_news_title"><a href="index.html">Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum</a><p style="width:380px;font-weight:normal;margin-top:4px"><a href="index.html" class="desc">Lorem ipsum<img src="gfx/arrows1.png" style="margin-left:4px"/></a></p></div>
</div>
 
</div>
 
 
 
        <div class="euro_nawigacja">
<div id="paginate-slider4">
 
<a href="#" class="toc"><div>1</div></a>
<a href="#" class="toc"><div>2</div></a>
<a href="#" class="toc"><div>3</div></a>
<a href="#" class="toc"><div>4</div></a>
 
</div>
 
 
        </div>
        <script type="text/javascript">
 
featuredcontentslider.init({
id: "slider4", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "markup", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
enablefade: [true, 0.75], //[true/false, fadedegree]
autorotate: [true, 5000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
 
</script>
<?php }?>
 
[PHP] pobierz, plaintext 

To jest pierwszy problem, problem drugi polega na tym że drugi skrypt który jest odpowiedzialny za automatyczne wyświetlanie czterech wydarzeń działa dopiero wtedy gdy :

1 - wejdziemy na stronę
2 - przełączymy się na inną zakładkę (to wynik pierwszego problemu) i wrócimy znów do zakładki Wydarzenia
3 - odświeżymy stronę


Problemu nie ma gdy ten skrypt nie jest wewnątrz pierwszego skryptu i nie jest przetwarzany w pliku przeglad.php. Za działanie drugiego skryptu jest odpowiedzialny kod :

<script type="text/javascript">

featuredcontentslider.init({
id: "slider4", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "markup", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
enablefade: [true, 0.75], //[true/false, fadedegree]
autorotate: [true, 5000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})

</script>

oraz linijka w sekcji HEAD ładująca jeszcze skrypt z zewnątrz

<script type="text/javascript" src="contentslider.js"></script>


Mam nadzieję że w miarę jasno się wyraziłem (IMG:style_emoticons/default/smile.gif)

Jak rozwiązać te problemy ? Proszę o pomoc i z góry dziękuje (IMG:style_emoticons/default/winksmiley.jpg)