Раскрытие div из центра экрана

  1. 2 г. назад

    Господа. Хочу, чтобы некий div из "нулевой позиции" (не отображается, без z-индекса, без контента и без рамок) разворачивался в полноэкранный.
    В упор не пойму, как мне это сделать.
    Понятно, что добавлять/убирать классы надо.

    		function hide_details(current_position){
    			current_position.classList.add('hide_details');
    			current_position.classList.remove('show_details');
    		}
    		
    		function show_details(current_position){
    			current_position.classList.add('show_details');
    			current_position.classList.remove('hide_details');
    		}
    

    Но что в классе писать?

  2. 		.hide_details{
    			position: absolute;
    			opacity: 0;
    			width: 0;
    			height: 0;
    			left: 0;
    		}
    

    Это, видимо, так.
    Но что дальше?

  3. Вот если так, то почти оно:

    		.show_details{
    			position: absolute;
    			left: 50%;
    			background-color: #aaa;
    			opacity: 100;
    			width: 100%;
    			height: 100%;
    			left: 0;
    			transition: left 2s, width 2s, height 2s, background-color 2s;
    			border-radius: 20px; 
    			border: 1px solid #88a;
    
    		}
    
  4. А вроде разобрался... Там всё через transition...

  5. Во первых в таких случаях (вопросы по верстке) надо не сюда свой код вываливать, а в песочницу, например http://jsfiddle.net/uq2synb1/#&togetherjs=UbLK2qgeHR
    Во вторых уже не важно, раз сам разобрался, пока я во первых писал :)

  6. Главное, сразу не накидывать варианты ответа и Дуб сам разберется.

  7. Это да. Сразу не надо. Я обычно сам разбираюсь.

  8. Но вот сейчас у меня почему-то перестало искать по id...
    В документе есть таблица, строки таблицы имеют id, соответствующие штрих-коду товара ('id_' + ШК).
    Читаю ШК и делаю let c_pos = document.getElementById('id_' + row_id);
    И эта самая c_pos у меня стабильно == null...
    Хрень какая-то...

    Ответы: (11)
  9. 11.11.2021 17:02:07 отредактировано Дуб
    		function process_row(row_id){
    			if(row_id.length > 3 && row_id.substring(0, 3) != 'id_'){
    				row_id = 'id_' + row_id;
    			}
    			console.log(typeof row_id);
    			let c_pos = document.getElementById(row_id);
    			if(c_pos != null){
    				let current_position = document.getElementById('current_position');
    				hide_details(current_position);
    				show_details(current_position, c_pos);
    			}
    			else{
    				console.log('not found ' + row_id);
    			}
    		}
    

    Думал - мож тип криво определяется. Но нет. Строка там... При этом если вызываю по клику, то без проблем отрабатывает. А по вводу ШК - куй.

    Вот, например, такая строка:

    <tr id="id_10603295232049" art="960015" name="PFC Sigma CR Феморальный комп. цем.фикс., правый р.5">
    <td class="name"><span class="art">960015</span><br>PFC Sigma CR Феморальный комп. цем.фикс., правый р.5</td>
    <td class="count">1</td><td class="r_count" onclick ="process_r_count('id_10603295232049')">0</td>
    </tr>
  10. Да, если что, то

    		function process_r_count(c_id){
    			process_row(c_id);
    		}
    
  11. Как?!

  12. (7) может, у тебя более одного элемента с данным id?

    Ответы: (12)
  13. (11) нет. Они уникальны. Но даже не в этом вопрос: по клику же отрабатывает ровно та же самая функция с тем же самым параметром...

    Ответы: (14)
  14. И ведь стопудово - в моих криворучках дело...

  15. (12) а что у тебя в document в случае, когда не работает?

    Ответы: (15)
  16. (14) в смысле? Вызов-то в рамках одного и того же документа. Просто в одном случае - по клику на ячейке, а в другом - по набору нужной длины строки (чтение ШК). Тот же документ, та же функция..

    Ответы: (16)
  17. (15) проверь

  18. html динамически формируется?

    Ответы: (19)
  19. console.log(document); ?

  20. andrewks html динамически формируется?

    не. В данном случае нет. Страница с сервера целиком приходит. Там есть возможность обращения по ajax, но не используется

  21. Лан, надо с этой гадостью переспать...

  22. Переспал. Не помогло.
    Чертовщина какая-то…
    На случай, если я неверно отработал восстановление символов при сканировании - вывел считанное в консоль и скопипастил в тестовую функцию:

    		function tst(){
    			let c_id = 'id_10603295062608';
    			process_row(c_id);
    		}
    

    Вот прямо скопипастил, с без вариантов.
    И - куй. Из tst() отрабатывает корректно, а из процедуры сканирования - нет.

    И опять же - ладно бы тут что непроверенное было. Так нет. Я-ж под этот сканер до этой шняги уже три софтины рабочих нарисовал...

  23. Бляцтво. Сделяль row_id = row_id.trim(); Заработало. При том, что визуально ничто не предвещало. По ходу - сканер лепит непечатаемый символ какой-то...
    Мать его ити.
    Ну как так-то?!

или зарегистрируйтесь чтобы ответить!