Как сделать текст под кнопкой на странице сайта

Опубликовано:
Просмотров: 1470
0
Голосов: 0
Сегодня поделюсь одной простой разработкой, которая возможно пригодится кому для создания кнопок с текстом под ней, на любой странице сайта. Так вышло что мне понадобилось, покопался и таки собрал в кучу.

Для начала заходим в includes/myphp/ и закидываем туда файл (название например knopki.php) с таким вот содержимым

Код PHP:
  1. <script type="text/javascript">
  2. function toggle(objNameText) {
  3. var objText = document.getElementById(objNameText);
  4. if ( objText !== null ) {
  5. objText.style.display = (objText.style.display == '') ? 'none' : '';
  6. }
  7. }
  8. </script>
  9.  
  10. <style>
  11. .linkas {
  12. background: #F7F7F7;
  13. padding: 12px;
  14. color: #0083B9;
  15. border: 1px solid #ccc;cursor:pointer;
  16. }
  17. #test, #test1, #test2 {
  18. background-color: #F5F5F5;
  19. padding: 10px;
  20. border: 1px solid #ccc;
  21. border-top: none;
  22. }
  23. </style>
  24.  
  25. <div class="linkas" onclick="toggle('test')"><strong><span style="font-size: 21px;font-weight: 500;">Тест название кнопки</span></strong></div>
  26. <div id="test" style="display:none">Текст, который скрыт в кнопке 1</div>
  27. <br />
  28. <div class="linkas" onclick="toggle('test1')"><strong><span style="font-size: 21px;font-weight: 500;">Тест название кнопки</span></strong></div>
  29. <div id="test" style="display:none">Текст, который скрыт в кнопке 1</div>
  30. <br />
  31. <div class="linkas" onclick="toggle('test2')"><strong><span style="font-size: 21px;font-weight: 500;">Тест название кнопки</span></strong></div>
  32. <div id="test" style="display:none">Текст, который скрыт в кнопке 1</div>
  33. <br />

Дальше на нужное странице добавляете на страницу файл php и указываете этот файл. Всё работает. Стили можно поправить под себя.
Комментарии (0)

Нет комментариев. Ваш будет первым!

Голосуем

Самый нужный компонент