Question

Po kliknięciu na pole "Nazwa użytkownika" nie wyskakuje po prawej stronie pole tekstowe z info.

Chciałbym, aby po kliknięciu na pole "Nazwa użytkownika" wyskoczyło obok po prawej stronie pole tekstowe z info z tekstem, np. "Twój nick (login, nazwa użytkownika) powinien zawierać minimum 6 znaków i maximum 30 znaków."

Będę bardzo wdzięczny za pomoc.

<div id="content">
		<div id="pole_tekstowe">
			<form method="post" action="formularz.php">
				<label for="username">Nazwa użytkownika:</label>
				<input type="text" placeholder="Login" id="username" name="username" class="inpUsername">
			</form>
		</div>
</div>

input.inpUsername[type="text"]:focus
{
	margin-bottom: 20px;
	position: relative;
	left: 200px;
	background-color: #FFFF00;
}

#username
{
	display: block;
	width: 300px;
	padding: 4px;
	margin-bottom: 20px;
	position: relative;
	left: 200px;
}

#pole_tekstowe
{
	display: none;
	width: 300px;
	height: 200px;
	background: #008000;
	font-size: 11px;
	position: absolute;
	z-index: 9999;
	top: 50px;
}

 

Answer 1

Znalazłem coś takiego:

http://jsfiddle.net/shail/vstlu/2/

Tylko, że niewidoczne są tam style CSS (brak podanej klasy"navbar tooltip-demo" i "nav") i co prawda wyskakuje po prawej stronie pole z tekstem po najechaniu na przycisk, np. na "Tooltip on right".

A mi chodzi tylko o pole z tekstem (chmurkę) po kliknięciu w pole "Nazwa użytkownika".

Comments

Do zdarzenia po kliknięciu potrzebny jest Javascript.

---

Nie są widoczne, bo są to style importowane z bootstrap.css -> http://getbootstrap.com/

---

Na youtubie znalazłem coś w tym temacie:

https://www.youtube.com/watch?v=bKXorc022Pc

Answer 2

http://jsfiddle.net/gwLz2hou/3/

Comments

Myślę, że będziesz już potrafić wykorzystać to :) Niekoniecznie musi być to odniesione do linku, ale akurat tak mi było szybciej.

---

Niby OK, ale hover służy w tym celu po najechaniu na dany element. A mi chodzi o zdarzenie po kliknięciu na element.

---

To użyj  pseudoklasy focus...