Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [jQuery]Obrócony tekst w komórce tabeli
wicek
post
Post #1





Grupa: Zarejestrowani
Postów: 55
Pomógł: 1
Dołączył: 13.02.2014

Ostrzeżenie: (0%)
-----


Witam, próbuję uruchomić skrypt obracający tekst w komórce o 90 stopni z strony : Rotate table cell content i nie udaje mi się... Czy mógł by ktoś pokazać mi jak to ma wyglądać na przykładzie jednej komórki w tabeli aby tekst był obrócony?

style_text.css
  1. <STYLE type="text/css">
  2. /* Styles for rotateTableCellContent plugin*/
  3. table div.rotated {
  4. -webkit-transform: rotate(90deg);
  5. -moz-transform: rotate(90deg);
  6. writing-mode:tb-rl;
  7. white-space: nowrap;
  8. }
  9.  
  10. thead th {
  11. vertical-align: top;
  12. }
  13.  
  14. table .vertical {
  15. white-space: nowrap;
  16.  
  17. }


test.php
  1. <link rel="stylesheet" type="text/css" href="style_text.css">
  2. <script src="jquery.js">
  3. (function ($) {
  4. $.fn.rotateTableCellContent = function (options) {
  5. /*
  6. Version 1.0
  7. 7/2011
  8. Written by David Votrubec (davidjs.com) and
  9. Michal Tehnik (@Mictech) for ST-Software.com
  10. */
  11.  
  12. var cssClass = ((options) ? options.className : false) || "vertical";
  13.  
  14. var cellsToRotate = $('.' + cssClass, this);
  15.  
  16. var betterCells = [];
  17. cellsToRotate.each(function () {
  18. var cell = $(this)
  19. , newText = cell.text()
  20. , height = cell.height()
  21. , width = cell.width()
  22. , newDiv = $('
  23. <div>', { height: width, width: height })
  24. , newInnerDiv = $('
  25. <div>', { text: newText, 'class': 'rotated' });
  26.  
  27. newDiv.append(newInnerDiv);
  28.  
  29. betterCells.push(newDiv);
  30. });
  31.  
  32. cellsToRotate.each(function (i) {
  33. $(this).html(betterCells[i]);
  34. });
  35. };
  36. })(jQuery);
  37. $('.dupa2')
  38. .rotateTableCellContent({className: 'dupa'});
  39.  
  40. <table class="dupa2"><tr><td class="dupa">dupa</td>



Z góry dzięki za pomoc

Wicek
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 11.10.2025 - 14:20