Afficher/positionner div/span > un défi?

[Résolu/Fermé]
Signaler
Messages postés
485
Date d'inscription
lundi 7 juillet 2008
Statut
Membre
Dernière intervention
15 février 2013
-
Messages postés
21
Date d'inscription
lundi 7 juin 2010
Statut
Membre
Dernière intervention
10 juin 2010
-
Bonjour à tous et toutes,
je vous expose mon problème, ma foi, bien tordu!
pour ceux qui s'en rappelle, j'avais un problème avec mes frames, après grosse pression, j'ai enfin eu le droit d'utiliser des divs! ouf!!!
bref, mais retour à mon soucis du jour

voilà le principe :

sur une page je veux avoir la structure suivante sur une seule ligne.

"bouton previous" box qui choisit la page "bouton next" box qui choisit le nombre de résultat à afficher.

jusque là tout va bien, c'ets vraiment pas dur!

le problème est que en page 1, le bouton previous ne doit pas exister. en derniere page, le bouton next non plus.
du coup, je joue avec des divs et des display block/none.
et là paf!
mes boutons se mettent en début de ligne.

bon, je cherche et je me dit, on va tenter les spans.
ca m'assure la propriété inline et m'evite un retour à la ligne embétant.

mais là ooooh surprise, ça ne marche pas.

bon, j'ai aussi tenté du mettre du inline dans des divs sans grand succès.

le problème à mon avis viens du fait que lorsque je bascule mes display a block/none ca m'enleve mes propriétés inline.
mais ceci n'est qu'une hypothèse.

je colle mon code html et mon javascript ci-dessous.

html :
<div style="height:3%; vertical-align:middle;margin-top:0.5%">
		<span id="previous" style="display:none;">
			<a href="#">Previous</a>
			&nbsp;&nbsp;&nbsp;
		</span>
		Page Selection : 
		<select>
			<option selected onclick="javascript:OpenPage('1')">1</option>
			<option onclick="javascript:OpenPage('2')">2</option>
			<option onclick="javascript:OpenPage('3')">3</option>
			<option onclick="javascript:OpenPage('4')">4</option>
			<option onclick="javascript:OpenPage('5')">5</option>
			<option onclick="javascript:OpenPage('6')">6</option>
			<option onclick="javascript:OpenPage('7')">7</option>
			<option onclick="javascript:OpenPage('8')">8</option>
		</select>
		<span id="next">
			&nbsp;&nbsp;&nbsp;
			<a href="#">Next</a>
		</span>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		Results by page :
		<select>
			<option selected>20</option>
			<option>50</option>
			<option>100</option>
			<option>150</option>
			<option>ALL</option>
		</select>
	</div>



java :
function OpenPage(Mypage)
{
	if (Mypage==1)
	{
		var onglet=document.getElementById('previous');
		onglet.style.display="none";
		var onglet=document.getElementById('next');
		onglet.style.display="block";
	}
	else if (Mypage==8)
	{
		var onglet=document.getElementById('previous');
		onglet.style.display="block";
		var onglet=document.getElementById('next');
		onglet.style.display="none";
	}
	else
	{
		var onglet=document.getElementById('previous');
		onglet.style.display="block";
		var onglet=document.getElementById('next');
		onglet.style.display="block";
	}
	window.alert('on va page' + Mypage);
}	



voilà, je remercie tous ceux qui ont lu, même si ils n'ont pas de réponse.
quant à celui qui trouve de quoi me dépatouiller, il gagnera ma reconnaissance eternelle!

c'est déjà ça =)


6 réponses

Messages postés
3538
Date d'inscription
jeudi 15 mai 2008
Statut
Membre
Dernière intervention
11 septembre 2016
463
if($_GET['page']!='xxxx')
{
echo'yyyy';
}

En remplaçant bien évidement les xxxx et les yyyy et en supposant que tes pages sont identifié par une variable dans l'url.
1
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 42674 internautes nous ont dit merci ce mois-ci

Messages postés
21
Date d'inscription
lundi 7 juin 2010
Statut
Membre
Dernière intervention
10 juin 2010
5
Si la display:inline fonctionne pourquoi ne pas faire ceci :

onglet.style.display="inline";

Sinon il faut que tu ajouter un float:let à ton span il me semble.
Messages postés
352
Date d'inscription
dimanche 30 mai 2010
Statut
Membre
Dernière intervention
6 mars 2014
73
corrections :
- utiliser la propirété css "visibility" au lieu de "display". renseigne toi su la différence entre "inline" et "block". ca reglera le problème de d'alignement sur une ligne. visibility:hidden et visibility:visible au lieu de display:block et display:none;"
- ensuite corrige le bloc select
<select onchange="OpenPage(this.value);">
			<option selected value="1">1</option>
			<option value="2">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
			<option value="5">5</option>
			<option value="6">6</option>
			<option value="7">7</option>
			<option value="8">8</option>
		</select>

- pour finir quand tu changera de page ton code ne sera plus valable puisque tes actions ne sont prises en compte qu'en temps réel.

pour que ca fonctionne
- il faut récupérer le n° de page et créer une condition "for" pour afficher le select
Messages postés
21
Date d'inscription
lundi 7 juin 2010
Statut
Membre
Dernière intervention
10 juin 2010
5
Content d'avoir pu être utile. Bonne suite.
Messages postés
485
Date d'inscription
lundi 7 juillet 2008
Statut
Membre
Dernière intervention
15 février 2013
18
j'ai testé avec le inline et ça ne marche pas.
ca doit venir du fait que j'ai déjà un display avant.

pour le flot:right ou float:left, en fait ça me place le bouton à droite ou a gauche de la page complète.
je pense que l'idée du inline est à creuser.
je continue de mon coté, mais si qulqu'un a une solution, qu'il n'hesite pas!!!
=)
Messages postés
485
Date d'inscription
lundi 7 juillet 2008
Statut
Membre
Dernière intervention
15 février 2013
18
haha trouver!!!
merci foisgras ton idée du inline m'a fait pensé a un truc.
en fait le principe est d'appliquer un display après l'autre.
ainsi, apres avoir affiché, je met inline.
ce qui donne ça :

html :
<div style="height:3%; vertical-align:middle;margin-top:0.5%">
		<div id="previous" style="display:none;display:inline">
			<a href="#">Previous</a>
			&nbsp;&nbsp;&nbsp;
		</div>
		Page Selection : 
		<select>
			<option selected onclick="javascript:OpenPage('1')">1</option>
			<option onclick="javascript:OpenPage('2')">2</option>
			<option onclick="javascript:OpenPage('3')">3</option>
			<option onclick="javascript:OpenPage('4')">4</option>
			<option onclick="javascript:OpenPage('5')">5</option>
			<option onclick="javascript:OpenPage('6')">6</option>
			<option onclick="javascript:OpenPage('7')">7</option>
			<option onclick="javascript:OpenPage('8')">8</option>
		</select>
		<div id="next" style="display:inline">
			&nbsp;&nbsp;&nbsp;
			<a href="#">Next</a>
		</div>
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		Results by page :
		<select>
			<option selected>20</option>
			<option>50</option>
			<option>100</option>
			<option>150</option>
			<option>ALL</option>
		</select>
	</div>


java :
function OpenPage(Mypage)
{
	if (Mypage==1)
	{
		var onglet=document.getElementById('previous');
		onglet.style.display="none";
		var onglet=document.getElementById('next');
		onglet.style.display="block";
		onglet.style.display="inline";
	}
	else if (Mypage==8)
	{
		var onglet=document.getElementById('previous');
		onglet.style.display="block";
		onglet.style.display="inline";
		var onglet=document.getElementById('next');
		onglet.style.display="none";
	}
	else
	{
		var onglet=document.getElementById('previous');
		onglet.style.display="block";
		onglet.style.display="inline";
		var onglet=document.getElementById('next');
		onglet.style.display="block";
		onglet.style.display="inline";
	}
	window.alert('on va page' + Mypage);
}	


merci bcp!

a bientôt peut être/surement!