Forum Ubuntu-it

Salve, devo creare una pagina web nella quale, cliccando su un link "i nostri contatti" si apre una finestra di dropdown con un triangolo-freccia che indica a quale dei tre box si riferisce; in questo modo:
Immagine

Quello che non va bene è che, come si vede dalla foto, io ho tre box con tre link "i nostri contatti" ma se apro dal secondo o dal terzo box, la freccia punta sempre al primo box:
Immagine

.

Sto usando tramite CSS le funzioni nth-child ma non capisco perché non funzionano.
Allego qui tutto ciò che ho scritto, se qualcuno potesse darmi una mano farebbe cosa molto gradita. Grazie.

HTML

Codice: Seleziona tutto

<div id="mercatiDropdown" class="row contattiMercatiBox yamm">
	<div class="col-xs-4 dropdown yamm-fw contattiMercatiBoxItem">
		<h2 class="titleBoxMercatiContatti">FINANZIAMENTI</h2>
		<hr/>
		<a href="#" class="link_contatti" data-toggle="dropdown">I nostri contatti</a>
		<div class="dropdown-menu">
			<div class="col-xs-12 boxContattiDropDown">
				<p class="paragraphL">contatti finanziamenti MLT<br>
					Numero Verde 800.530.701<br>
					E-mail <a href="mailto:deskoperativo@mediocreditoitaliano.com">deskoperativo@mediocreditoitaliano.com</a><br>
				</p>
			</div>
		</div>
	</div>
</div>

CSS

Codice: Seleziona tutto

.boxContattiDropDown:before{
	content:"";
	display:inline-block;
	position:absolute;
	border-right: 20px solid transparent;
	border-bottom: 20px solid #f3f3f3;
	border-left: 20px solid transparent;
	border-top-color: rgba(0, 0, 0, 1);
	top:-26px;
}

.boxContattiDropDown:nth-child(1):before{
	left:15%;
}
.boxContattiDropDown:nth-child(2):before{
	left:48%;
}
.boxContattiDropDown:nth-child(3):before{
	left:82%;
}

Come lo devo scrivere il javascript?

fai prima se la freccia la metti in posizione assoluta nel contenitore che hai cliccato. (Ottieni lo stesso effetto).

Dici che la freccia deve partire a meta' meno la dimensione della freccia con spazio dall'alto uguale al contenitore.

risulta cosi:

Codice: Seleziona tutto

+-----+
|     |
+-----+
   ^

SuperStep [url=http://forum.ubuntu-it.org/viewtopic.php?p=4767603#p4767603][img]http://forum.ubuntu-it.org/images/icons/icona-cita.gif[/img][/url] ha scritto:fai prima se la freccia la metti in posizione assoluta nel contenitore che hai cliccato. (Ottieni lo stesso effetto).

Dici che la freccia deve partire a meta' meno la dimensione della freccia con spazio dall'alto uguale al contenitore.

risulta cosi:
Codice: Seleziona tutto
+-----+
|     |
+-----+
   ^

No, Questa era la cosa che era stata fatta all'inizio ma aveva un problema:
Quando cliccavi da qualche parte a caso sullo schermo, scompariva la tendina dropdown ma rimaneva il triangolo. In questo modo invece, poiché la freccia è parte del menu dropdown. quando scompare l'uno scompare anche l'altro.

Forum Ubuntu-it

Javascript + CSS: nth-child()

Javascript + CSS: nth-child()

Re: Javascript + CSS: nth-child()

Re: Javascript + CSS: nth-child()