Advertisement
Guest User

Untitled

a guest
Jul 19th, 2019
95
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.07 KB | None | 0 0
  1. var content = document.getElementsByClassName("show-less-content")[0];
  2.  
  3. var content = document.getElementsByClassName("show-less-content")[0];
  4.  
  5. <style>
  6. .show-less-content {
  7. min-width: 100%;
  8. width: 100%;
  9. background: #fff;
  10. padding: 0px;
  11. padding-top: 0;
  12. font-family: calibri;
  13. font-size: 18px;
  14. color: #444;
  15. margin: 0;
  16. max-height: 105px;
  17. overflow: hidden;
  18. -webkit-transition: max-height 0.7s;
  19. -moz-transition: max-height 0.7s;
  20. transition: max-height 0.7s;
  21. }
  22. .open{
  23. max-height: 100%;
  24. -webkit-transition: max-height 0.7s;
  25. -moz-transition: max-height 0.7s;
  26. transition: max-height 0.7s;
  27. }
  28.  
  29. <script>
  30. if (document.readyState == 'loading') {
  31. document.addEventListener('DOMContentLoaded', ready)
  32. } else {
  33. ready()
  34. }
  35. function ready() {
  36. //var content = document.getElementsByClassName("show-less-content")[0];
  37. var content = document.getElementsByClassName("show-less-content");
  38. var showButton = document.getElementsByClassName("show-more");
  39. for (var i = 0; i < showButton.length; i++) {
  40. showButton[i].addEventListener('click', function(event){
  41. var buttonLessMore = event.target
  42. var cartItem = buttonLessMore.parentElement
  43. //var content = document.getElementsByClassName("show-less-content")[0];
  44. if (content.className == "open") {
  45. content.className = ""
  46. buttonLessMore.innerHTML = "Show More"
  47. } else {
  48. content.className = "open"
  49. buttonLessMore.innerHTML = "Show Less"
  50. }
  51. //content.classList.remove("open")
  52. //content.append(buttonLessMore)
  53. //content.className += "shop-item"
  54. })
  55. }
  56. </script>
  57.  
  58. <?php
  59. $sql = "SELECT `bestellnummer`, `name`, `preis`, `gewuerzart`, `allergieform`, `zutaten`, `kcal`, `menge`, `img` FROM `gerichte` LIMIT 2";
  60. $db_erg = mysqli_query( $con, $sql );
  61. if ( ! $db_erg ) { die("Ungültige Abfrage: $sql <hr>" . mysqli_error()); }
  62. if (mysqli_num_rows($db_erg) > 0) {
  63. while ($zeile = mysqli_fetch_assoc($db_erg)) {
  64. echo '<tr>';
  65. echo '<td class="tab-cfg"><img class="myImg" src ="'. $zeile['img'] .'"></td>';
  66. echo '<td class="tab-cfg td-content" width="70%">';
  67. echo '<div class="show-less-content">';
  68. echo '<table>';
  69. echo '<tr>';
  70. echo '<td>Gericht:</td>';
  71. echo '<td class="shop-item-title">'.$zeile['name'].'</td>';
  72. echo '</tr><tr>';
  73. echo '<td>Bestellnummer:</td>';
  74. echo '<td class="shop-item-title2">'.$zeile['bestellnummer'].'</td>';
  75. echo '</tr><tr>';
  76. echo '<td>Allergieinformation:</td>';
  77. echo '<td>'.$zeile['allergieform'].'</td>';
  78. echo '</tr><tr>';
  79. echo '<td>Gewürzart:</td>';
  80. echo '<td>'.$zeile['gewuerzart'].'</td>';
  81. echo '</tr><tr>';
  82. echo '<td>Zutaten:</td>';
  83. echo '<td>'.$zeile['zutaten'].'</td>';
  84. echo '</tr><tr>';
  85. echo '<td>Nährwert:</td>';
  86. echo '<td>'.$zeile['kcal'].'</td>';
  87. echo '</tr><tr>';
  88. echo '<td>Menge:</td>';
  89. echo '<td>'.$zeile['menge'].'</td>';
  90. echo '</tr>';
  91. echo '</table>';
  92. echo '</div>';
  93. echo '<button class="show-more">Show More</button>';
  94. echo '</td>';
  95. echo '<td class="tab-cfg-2">';
  96. echo '<div>Preis:</div>';
  97. echo '<div class="shop-item-price ">'.$zeile['preis'].'</div>';
  98. echo '</td>';
  99. echo '<td class="tab-cfg-3">';
  100. echo '<button class="btn btn-primary shop-item-button" >In den Warenkorb</button>';
  101. echo '</td>';
  102. echo '</tr>';
  103. }
  104. } else {
  105. echo 'Es gibt keine Gerichte!';
  106. }
  107. ?>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement