Ledger Nano X - The secure hardware wallet
SHARE
TWEET

DIV toggling with jQuery - found on www.kulturbanause.de

a guest Feb 9th, 2012 1,241 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html lang="de" xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
  6. <script type="text/javascript">
  7. $(document).ready(function(){
  8.         $(".da").click(function(){ // trigger
  9.                 $(this).next(".do").slideToggle("medium"); // blendet beim Klick das div da das div do ein.
  10.                 $(this).children("a").toggleClass("closed open"); // Klick auf DIV "da" wechselt a-tag von "closed" zu "open" -- arrow flipover
  11.                 $(this).children("span").toggleClass("hier weg"); // macht die drei Punkte hinter jedem Paragraphen auf klick unsichtbar und wieder sichtbar
  12.         });
  13. });
  14. </script>
  15. <style type="text/css">
  16. .da {cursor:pointer;text-align:justify; width:200px;}
  17. .do {display:none; text-align:justify; width:200px;}
  18. .hier {visibility:visible; color: #666152; text-decoration:underline;}
  19. .weg  {display:none;}
  20. .closed {float:right; height:18px; width:17px; margin-top:-17px; margin-right:-25px; text-indent:-9999px; background:url(button.png) left no-repeat;}
  21. .open {float:right; height:18px; width:17px; margin-top:-17px; margin-right:-25px; text-indent:-9999px; background:url(button.png) right no-repeat;}
  22. </style></head>
  23. <body>
  24.  
  25. <blockquote>
  26.   <div class="da">Erster Teil des Textes, der platzmäßig noch hinpasst, bevor er dann abrupt vom Hinweis auf einen längeren Text abgebrochen wird <span class="hier">&rarr; mehr lesen</span><a class="closed" title="mehr lesen ..."></a></div>
  27.   <div class="do">der dann hier erscheint, vorher aber versteckt war. Hier lassen sich auch auf Wunsch auch Paragraphen  einfügen. Außerdem DIVs statt dt / dd
  28.   </div>
  29. </blockquote>
  30.  
  31.  
  32. </body></html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top