Pokaż/ukryj tekst – jquery.

Prosty skrypt który ukrywa bieżący tekst w tym przypadku link i pokazuje dodatkowy tekst umieszczony w divach.
Poniżej gotowy kod.

Deklarujemy style:

<style>.h { display: none }</style>

Dodajemy bibliotekę jquery :

<script type=”text/javascript” src=”http://code.jquery.com/jquery-1.4.1.js”></script>

Dodajemy prosty skrypt:

<script>
function switchBox()
{
$(‚#dymek1’).show();
$(‚#clickMe’).hide();
}
</script>

Dodajemy link który odkryje zakryty tekst:

<a href=”#” id=”clickMe” onclick=”switchBox()”>pokaz dodatkowy tekst</a>

Oraz nasz zakryty tekst zdeklarowany w divie:

<DIV ID=”dymek1″>Przykladowy tekst</DIV>

Cały kod wygląda tak:

<html><head>
<title>Przyklad1</title>
</head>
<style>.h{display: none}</style>
<body>
<script type=”text/javascript” src=”http://code.jquery.com/jquery-1.4.1.js”></script>
<script>function switchBox() {$(‚#dymek1’).show();$(‚#clickMe’).hide(); }</script>

<a href=”#” id=”clickMe” onclick=”switchBox()”>pokaz dodatkowy tekst</a>
<DIV ID=”dymek1″>Przykladowy tekst</DIV>
</body>
</html>

 

Jeżeli macie jakieś inne pomysły jak dynamicznie bez odświeżania strony pokazać/ukryć tekst piszcie w komentarzach 🙂

Podziel się :
  • Facebook
  • Twitter
  • email
  • Drukuj
  • PDF

Może Ci się również spodoba

2 komentarze

  1. Adi pisze:

    Szkoda że nie ma dema

  2. AdamP pisze:

    Dzięki za dobrą wskazówkę. Na pewno się przyda!

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

This site uses Akismet to reduce spam. Learn how your comment data is processed.