PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (1): [1]   

> Описание: Проблема отображения формы
Nechtus
Отправлено: 03 Марта, 2017 - 19:25:27
Post Id


Новичок


Покинул форум
Сообщений всего: 6
Дата рег-ции: Март 2017  


Помог: 0 раз(а)




дравствуйте, не знаю в правильный ли раздел я написал - надеюсь, что да)

Я реализую систему комментариев, и до последнего момента проблем не возникало, может код и получился слегка сумбурный и грязноватый, но всё работает, как надо. Начал реализовывать кнопки, которые появляются вместе с комментариями, покопался в инете и нашёл скрипт, который выводит при клике модальное окно. Сначало всё сделал для кнопки "ответить". А именно в самом низу сайта скрыта форма, а при клике она появляется отдельным окном и при заполнении с помощью аякса отправляется обрабатываться. Ничего сложного. Так же решил сделать с кнопкой комментировать. Добавил такую же форму вниз, прикрутил стили, и ... вторая форма в FF стала зависеть от стилей первой, хотя они нигде не пересекаются, и все теги закрыты. В хроме и edge всё работает. Далее привожу код.


1. HTML ( привожу весь див связанный с комментариями )

CODE (htmlphp):
скопировать код в буфер обмена
  1.  div class="substrate">
  2.                 <div class="view_comments">
  3.                 <?php if($_SESSION['auth']['user']):?>
  4.                 <?php if($_SESSION['com']):?>
  5.                 <h2>Комментарии</h2>
  6.                     <?php echo $_SESSION['com'];
  7.                    unset($_SESSION['com']);
  8.                    ?>
  9.                 <?php else:?>
  10.                     <p class="no_comments">К данной статье ещё нет ни одного комментария. Но вы можете его написать :)/></p>
  11.                     <div class="no_comments_img"><img  src="<?=TEMPLATE?>img/smile.png"/></div>
  12.                 <?php endif;?>
  13.                 </div>
  14.                 <div class="write_comments"><!-- Форма для написания комментария -->
  15.                     <h2>Написать комментарий</h2>
  16.                     <?php if($_SESSION['com']['error']):?>
  17.                     <div class='com_error'><? echo $_SESSION['com']['error'];
  18.                    unset($_SESSION['com']);                
  19.                    ?>
  20.                     </div>
  21.                     <?php endif;?>
  22.                     <form id="write_form" method="POST" action="#">
  23.                         <textarea cols="62.50" rows="10"  maxlength="90"  id="com_area" class="com_area" name="text"></textarea>
  24.                          <?php foreach($_SESSION['auth']['user'] as $auth):?>
  25.                          <input id="user_name" type="hidden" name="user_name" class="user_name" value="<?=$auth['name']?>" />
  26.                          <input id="bd_name" type="hidden" name="bd_name" class="bd_name" value="articles" />
  27.                          <? $note_id = abs((int)$_GET['id']);?>
  28.                          <input id="note_id" type="hidden" name="note_id" class="note_id" value="<?=$note_id?>" />
  29.                          <input id="parent_id" type="hidden" name="parent_id" class="parent_id" value="0" />
  30.                          <input class="com_answer_upload" id="com_answer_upload" type="submit" name="com_answer_upload" value="Комментировать"  />
  31.                          <?php endforeach;?>            
  32.                     </form>
  33.                     <?php else:?>
  34.                         <? echo "<div class='com_error'> Только зарегистрированные пользователи могут просматривать или писать комментарии!
  35.                        Пожалуйста, <a href='?view=reg'>регистрируйтесь</a>. Если вы авторизовались, то обновите страницу.
  36.                        </div>"; ?>
  37.                     <?php endif;?>
  38.                 </div>
  39.                 <div id="answer"><!-- Выезжающая форма ответа -->
  40.                     <span id="modal_close">X</span>
  41.                     <h2>Ответ на комментарий</h2>
  42.                         <?php if($_SESSION['com']['error']):?>
  43.                         <div class='com_error'><? echo $_SESSION['com']['error'];
  44.                        unset($_SESSION['com']);                
  45.                        ?>
  46.                         </div>
  47.                         <?php endif;?>
  48.                         <form id="answer_form" method="POST" action="#">
  49.                             <textarea cols="62.55" rows="40"  maxlength="100"  id="com_area_answer" class="com_area_answer" name="text"></textarea>
  50.                              <?php foreach($_SESSION['auth']['user'] as $auth):?>
  51.                              <input id="user_name" type="hidden" name="user_name" class="user_name" value="<?=$auth['name']?>" />
  52.                              <input id="bd_name" type="hidden" name="bd_name" class="bd_name" value="articles" />
  53.                              <? $note_id = abs((int)$_GET['id']);?>
  54.                              <input id="note_id" type="hidden" name="note_id" class="note_id" value="<?=$note_id?>" />
  55.                              <input id="com_parent_id" type="hidden" name="parent_id" class="parent_id" value="0" />
  56.                              <input class="answer_upload" id="answer_upload" type="submit" name="answer_upload" value="Ответить"  />
  57.                              <?php endforeach;?>
  58.                        </form>  
  59.                 </div>
  60.                 <div id="overlay"></div><!-- Пoдлoжкa -->
  61.                 <div id="redact_com"><!-- Такаяже форма для редактирования комментария -->
  62.                 <span id="modal_close">X</span>
  63.                      <h2>Редактировать комментарий</h2>
  64.                         <?php if($_SESSION['com']['error']):?>
  65.                         <div class='com_error'><? echo $_SESSION['com']['error'];
  66.                        unset($_SESSION['com']);                
  67.                        ?>
  68.                         </div>
  69.                         <?php endif;?>
  70.                         <form id="redact_form" method="POST" action="#">
  71.                              <textarea cols="62.50" rows="10"  id="area_redact" class="area_redact" name="text"></textarea>
  72.                              <?php foreach($_SESSION['auth']['user'] as $auth):?>
  73.                              <input id="user_name" type="hidden" name="user_name" class="user_name" value="<?=$auth['name']?>" />
  74.                              <input id="bd_name" type="hidden" name="bd_name" class="bd_name" value="articles" />
  75.                              <? $note_id = abs((int)$_GET['id']);?>
  76.                              <input id="note_id" type="hidden" name="note_id" class="note_id" value="<?=$note_id?>" />
  77.                              <input id="parent_id" type="hidden" name="parent_id" class="parent_id" value="0" />
  78.                              <input class="redact_upload" id="redact_upload" type="submit" name="redact_upload" value="Ответить"  />
  79.                              <?php endforeach;?>            
  80.                          </form>  
  81.                 </div>
  82.                 <div id="overlay"></div><!-- Пoдлoжкa -->
  83.             </div>


2. CSS стиль для формы ответа на комментарий ( Для формы редактирования применяются теже стили, только с другим id)
CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. /*ответ на комментарий*/
  3. #answer {
  4. width: 515px;
  5. height: 300px; /* Рaзмеры дoлжны быть фиксирoвaны */
  6. border-radius: 5px;
  7. border: 3px #000 solid;
  8. background: #373737;
  9. position: fixed; /* чтoбы oкнo былo в видимoй зoне в любoм месте */
  10. top: 45%; /* oтступaем сверху 45%, oстaльные 5% пoдвинет скрипт */
  11. left: 50%; /* пoлoвинa экрaнa слевa */
  12. margin-top: -310px;
  13. margin-left: -180px; /* тут вся мaгия центрoвки css, oтступaем влевo и вверх минус пoлoвину ширины и высoты сooтветственнo =) */
  14. display: none; /* в oбычнoм сoстoянии oкнa не дoлжнo быть */
  15. opacity: 0; /* пoлнoстью прoзрaчнo для aнимирoвaния */
  16. z-index: 5; /* oкнo дoлжнo быть нaибoлее бoльшем слoе */
  17. padding: 20px 10px;
  18. }
  19. /* Кнoпкa зaкрыть для тех ктo в тaнке) */
  20. #answer #modal_close {
  21. width: 21px;
  22. height: 21px;
  23. position: absolute;
  24. top: 10px;
  25. right: 10px;
  26. cursor: pointer;
  27. display: block;
  28. }
  29. /* Пoдлoжкa */
  30. #overlay {
  31. z-index:3; /* пoдлoжкa дoлжнa быть выше слoев элементoв сaйтa, нo ниже слoя мoдaльнoгo oкнa */
  32. position:fixed; /* всегдa перекрывaет весь сaйт */
  33. background-color:#000; /* чернaя */
  34. opacity:0.8; /* нo немнoгo прoзрaчнa */
  35. -moz-opacity:0.8; /* фикс прозрачности для старых браузеров */
  36. filter:alpha(opacity=80);
  37. width:100%;
  38. height:100%; /* рaзмерoм вo весь экрaн */
  39. top:0; /* сверху и слевa 0, oбязaтельные свoйствa! */
  40. left:0;
  41. cursor:pointer;
  42. display:none; /* в oбычнoм сoстoянии её нет) */
  43. }
  44. .answer_upload
  45. {
  46.     width: 120px;
  47.     background: #000;
  48.    padding: 2px 5px 2px 5px;
  49.     border: 1px solid #CDCDE2;
  50.    color: #CDCDE2;
  51.    margin-top:10px;
  52.     border-radius:5px;
  53.     cursor: pointer;
  54. }
  55.  


) Итог следующий
а) Textarea в диве с id = redact_com ( форма редактирования комментария), который расположен под дивом с id = answer (форма ответа на комментариий) не отображается ( причём только в FF!!!), хотя ничего обющего я между этими формами и дивами я не вижу.
скрин

Нажмите для увеличения

б) Но если я меняю у diva с id = answer ( форма ответа) стиль на display: block , то textarea дива с id=redact_com (форма редактирования) становится виден


Нажмите для увеличения


в) В консоле FF есть ошибка ( Забыл сказать, что у меня прикручен TInyMCE).
CODE (htmlphp):
скопировать код в буфер обмена
  1.  TypeError: e is undefined[Подробнее]  tinymce.min.js:13:17430

Так вот эта ошибка пропадает, если textarea видна.

И повторю ещё раз в Хроме и edge - всё работает!!! Почему-то эта проблема только у FireFoxa!!!((( Прошу помогите, у меня уже руки опускаются и голова скоро отвалится от постоянного мозгового штурма(( Я просто не понимаю, как такое вобще может быть((( как два совершенно РАЗНЫХ дива, могут зависить от ОДНОГО свойства, которое прописано только для одного из них.. и причём всё это только при отображении в FF. Я даже не знаю, как правильно загуглить эту проблему, она помоему просто уникальна...

Заранее ОГРОМНОЕ спасибо!!
 
 Top
Nechtus
Отправлено: 03 Апреля, 2017 - 23:19:24
Post Id


Новичок


Покинул форум
Сообщений всего: 6
Дата рег-ции: Март 2017  


Помог: 0 раз(а)




Ппц, столько народу на форуме, а ответить никто не может уже месяц...вот тебе и один из лучших источников помощи в php - дизайне в интернете... такое впечатление, что здесь помогают только с простыми вопросами, а со сложными судя по всему народу лень разбираться...

(Отредактировано автором: 03 Апреля, 2017 - 23:20:07)

 
 Top
Строитель
Отправлено: 03 Апреля, 2017 - 23:27:16
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 741
Дата рег-ции: Февр. 2014  


Помог: 19 раз(а)




Nechtus пишет:
такое впечатление, что здесь помогают только с простыми вопросами, а со сложными судя по всему народу лень разбираться...
Ну а как вы думаете, кому интересно копаться в чужом коде?

Когда задают вопрос, и публикуют 10 - 20 строк кода, то его ещё не лень просмотреть. Но в ста тридцати строках (в общей сумме) кода вместо кого-то разбираться, это уж итак должно быть понятно. Если вам повезёт - может кто и найдётся желающий Закатив глазки Но не стоит полагаться на одно только везение.
 
 Top
Nechtus
Отправлено: 03 Апреля, 2017 - 23:39:00
Post Id


Новичок


Покинул форум
Сообщений всего: 6
Дата рег-ции: Март 2017  


Помог: 0 раз(а)




Строитель пишет:

Когда задают вопрос, и публикуют 10 - 20 строк кода, то его ещё не лень просмотреть. Но в ста тридцати строках (в общей сумме) кода вместо кого-то разбираться, это уж итак должно быть понятно. Если вам повезёт - может кто и найдётся желающий Закатив глазки Но не стоит полагаться на одно только везение.


Но тогда зачем позиционироваться как форум помощи?О_0 Назовитесь "Клуб любителей PHP" например, ну и флудите по темкам. Так будет честнее по отношению к пользователям... А то с одной стороны 100500 тем, где помогают в решении вопросов. И зайдя по ссылке с гугла ты сразу находишь нужный ответ. И всё вроде хорошо. Но с другой стороны, когда тебе нужна помощь и ты создаешь тему, тебя просто игнорят, только потому что людям лень пробежать глазами код, ведь его много....И самое смешное, что выложишь мало, будут кричать, что они не экстрасенсы, чтобы угадывать...

PS Ну коль я, хоть ваше внимание привлёк, то может вы можете?)))
 
 Top
Строитель
Отправлено: 03 Апреля, 2017 - 23:44:15
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 741
Дата рег-ции: Февр. 2014  


Помог: 19 раз(а)




Nechtus пишет:
может вы можете?)
Я бы с удовольствием вам помог, если бы спросили что-то в PHP )
 
 Top
Nechtus
Отправлено: 03 Апреля, 2017 - 23:52:26
Post Id


Новичок


Покинул форум
Сообщений всего: 6
Дата рег-ции: Март 2017  


Помог: 0 раз(а)




Строитель пишет:
Я бы с удовольствием вам помог, если бы спросили что-то в PHP )


Но мне всегда казалось, что PHP, CSS, HTML и JAVASCRIPT связаны...
Где-то косвенно, а где - то и полностью.
И если знаешь один язык, от туда вытекают и другие...
Нельзя же сайт написать только на php)))
Подмигивание Растерялся Огорчение
 
 Top
Nechtus
Отправлено: 04 Апреля, 2017 - 19:16:28
Post Id


Новичок


Покинул форум
Сообщений всего: 6
Дата рег-ции: Март 2017  


Помог: 0 раз(а)




Блин если никто не может помочь, то хотя бы подскажите, как загуглить проблему...пожалуйста! Растерялся Растерялся Растерялся
 
 Top
Строитель
Отправлено: 05 Апреля, 2017 - 00:16:50
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 741
Дата рег-ции: Февр. 2014  


Помог: 19 раз(а)




Судя по этой строке
Nechtus пишет:
форма в FF стала зависеть от стилей первой
проблема только в Firefox, а значит запрос на поиск надо составить примерно так: Специальные CSS хаки для Firefox
 
 Top
Nechtus
Отправлено: 08 Апреля, 2017 - 19:47:26
Post Id


Новичок


Покинул форум
Сообщений всего: 6
Дата рег-ции: Март 2017  


Помог: 0 раз(а)




Всё разобрался)) Как говорится " Если гора не идет к Магомеду..." . Я решил зайти с другой стороны. Я просто подумал, что если две формы не хотят уживаться на одной странице, то значит надо оставить одну, но использовать её под несколько целей. И тут мне на помощь пришёл волшебник Javascript! И вуаля всё заработало, да ещё и страница теперь быстрей грузится, ибо на одну форму меньше))
 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 1 (гостей: 1, зарегистрированных: 0)
« HTML, Дизайн & CSS »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB