Sujet Précédent Sujet Suivant

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

Résolu/Fermé
Steefif Messages postés 485 Date d'inscription lundi 7 juillet 2008 Statut Membre Dernière intervention 15 février 2013 - 8 juin 2010 à 11:45
Foiesgras Messages postés 21 Date d'inscription lundi 7 juin 2010 Statut Membre Dernière intervention 10 juin 2010 - 8 juin 2010 à 14:29
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

Réponse 1 / 6
arthezius Messages postés 3538 Date d'inscription jeudi 15 mai 2008 Statut Membre Dernière intervention 11 septembre 2016 475
8 juin 2010 à 12:51 
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
Réponse 2 / 6
Foiesgras Messages postés 21 Date d'inscription lundi 7 juin 2010 Statut Membre Dernière intervention 10 juin 2010 5
8 juin 2010 à 11:58
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.
0
Réponse 3 / 6
duweb Messages postés 353 Date d'inscription dimanche 30 mai 2010 Statut Membre Dernière intervention 6 mars 2014 72
8 juin 2010 à 12:47
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
0
Réponse 4 / 6
Foiesgras Messages postés 21 Date d'inscription lundi 7 juin 2010 Statut Membre Dernière intervention 10 juin 2010 5
8 juin 2010 à 14:29
Content d'avoir pu être utile. Bonne suite.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 6
Steefif Messages postés 485 Date d'inscription lundi 7 juillet 2008 Statut Membre Dernière intervention 15 février 2013 19
8 juin 2010 à 12:44
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!!!
=)
-1
Réponse 6 / 6
Steefif Messages postés 485 Date d'inscription lundi 7 juillet 2008 Statut Membre Dernière intervention 15 février 2013 19
8 juin 2010 à 13:00
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!
-1

Discussions similaires

Copain Pokémon et défi pour le faire évoluer
Pikachu -
Cricri61 -

8 réponses
positionner une image dans une page html
Cbast7 -
Kratos -

23 réponses
Où sont affichés les FPS Minecraft
Guerric -
malekpe -

9 réponses