Σταθερό μέρος ιστοσελίδας, καθώς ο χρήστης εναλλάσει σελίδες

[philos]

Γεια σας παιδιά

Μια ερώτηση: θέλουμε έναν mp3 player - html χωρίο σε μια σελίδα, να μένει σταθερό καθώς ο χρήστης εναλλάσσει σελίδες σε ένα site. Πως το πετυχαίνουμε αυτό; Να υποθέσω με iframes; Με τι κώδικα πάνω κάτω;

Ασφαλώς και όταν ο χρήστης φεύγει τελείως από το site, το πλαίσιο (πχ του mp3) θα πρέπει να εξαφανίζεται.

[giannis17]

Η πιο σωστή λύση είναι το μενού, το mp3 player και ότι άλλο θες να μένει σταθερό να αποτελούν τη βασική ιστοσελίδα και να έχεις ένα div όπου θα φορτώνονται τα επιμέρους περιεχόμενα με ajax. Ορίστε ένα κομμάτι κώδικα βασισμένο σε jQuery που παίζει και με permalinks

Κώδικας: Επιλογή όλων

/*
	με βάση το παρακάτω παράδειγμα:
		το μενού σου έχει id="navigation"
		οι σύνδεσμοι στο μενού είναι της μορφής&#58; <a href="#home">Αρχική</a>
		οι σελίδες σου βρίσκονται σε υποφάκελο "pages" με onomasia.php όπου onomasia είναι το #link από το μενού
		έχεις τίτλο της μορφής&#58; <div id="title"><h1>titlos</h1></div>
		τα περιεχόμενα εμφανίζονται στο <div id="content"></div>
*/

	function setTitle&#40;page&#41;&#123;
		var link = $.find&#40;'&#91;href="#'+page+'"&#93;'&#41;;
		$&#40; "#title h1" &#41;.first&#40;&#41;.text&#40;$&#40;link&#41;.text&#40;&#41;&#41;;
	&#125;
	$&#40; document &#41;.ready&#40;function&#40;&#41; &#123;
		if&#40;window.location.hash&#41;&#123;
			$&#40; "#content" &#41;.load&#40; "pages/"+window.location.hash.substr&#40;1&#41;+".php" &#41;;
			setTitle&#40;window.location.hash.substr&#40;1&#41;&#41;;
		&#125; else &#123;
			$&#40; "#content" &#41;.load&#40; "pages/home.php" &#41;;
			setTitle&#40;'home'&#41;;
		&#125;
	  &#125;&#41;;
	  $&#40;'#navigation a'&#41;.click&#40;function&#40;&#41;&#123;
		var href = $&#40;this&#41;.attr&#40;"href"&#41;;
		var page = href.substr&#40;1&#41;;
		$&#40; "#content" &#41;.load&#40; "pages/"+page+".php" &#41;;
		setTitle&#40;page&#41;;
	  &#125;&#41;;
	&#125;&#41;;

Με τον παραπάνω κώδικα λοιπόν φορτώνεις μέσα στο content τα περιεχόμενα του εκάστοτε αρχείου το οποίο φορτώνεται με ajax άρα ότι κώδικα php έχει μέσα τον τρέχει και γυρνάει το αποτέλεσμα. Ταυτόχρονα σου αλλάζει τον τίτλο με βάση το link που πατήθηκε και μπορείς κάλλιστα να κάνεις share permalinks από συγκεκριμένες σελίδες με τη μορφή www.mypage.gr/#contact και θα εμφανίζει το αντίστοιχο περιεχόμενο.

Γίνεται και με iframe αλλά πιστεύω με τον παραπάνω τρόπο έχεις πολύ περισσότερη ευελιξία και είναι και πιο γρήγορο για τον χρήστη (δεν βλέπει πουθενά να γίνεται κάποιο loading).