Ответы пользователя Антон Неверов по тегу «HTML»

Есть ли такой плагин?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

https://github.com/zalog/placeholder-loading

Ответ написан более трёх лет назад

1 комментарий

Какие есть аналоги select2?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Сами напишите, если уж насколько проблемно. Можно не все select'ы сразу подгружать, а по мере скролла их уже отображать.
Так или иначе все более-менее похоже работают.

Тестируйте просто всё по очереди:
https://selectize.github.io/selectize.js/
https://github.hubspot.com/select/docs/welcome/
https://selectric.js.org/

Или на ванильном JS: https://joshuajohnson.co.uk/Choices/ , https://slimselectjs.com/ - по идее, работать должно быстрее.

Ответ написан более трёх лет назад

1 комментарий

Насколько плохо у данного компонента DOM-структура?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

На много плохо. Какой именно ответ вы рассчитываете получить?

Ответ написан более трёх лет назад

10 комментариев

Передать данные из js в php без кнопки?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

https://learn.javascript.ru/events-change - вас интересуют событие change. По аналогии делаете.

Ответ написан более трёх лет назад

1 комментарий

Как сделать переход к другой форме JS?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Верстаете каждый экран отдельно. Потом перерву экрану даёте display: block, остальным - display: none.
Далее, при переходе на второй шаг делаете второму экрану display: block, остальным - display: none.
И т.д.

P. S. Такие штуки очень хорошо умеет реализовывать React.

Ответ написан более трёх лет назад

Комментировать

Как с помощью type="range" изменить значение переменной в js?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Так же как и с обычным инпутом: https://jsfiddle.net/girlie_mac/GKY2A/

Ответ написан более трёх лет назад

7 комментариев

Как загрузить внешний php код на html страницу?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

1) Использовать iframe.
2) Использовать JavaScript + PHP (или любой другой бек-енд)

Ответ написан более трёх лет назад

Комментировать

Что делать если макет не соответствует сетке бутстрап?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

https://getbootstrap.com/docs/3.4/customize/ - можете кастомизировать под себя сетку. Если дизайн вообще возможно уместить в сетку. И только если вам нужен третий. На четвёртом руками это всё делать надо.
Если же дизайн кривой-косой, что не помещается - объясните заказчику, что Bootstrap тут или не нужен, или дизайнер должен макет привести в порядок.

Ответ написан более трёх лет назад

Комментировать

Изменение select при клике?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

$(".woof_list li").click(function(){
     $(".order-by option").prop('selected', false);
     $(".order-by option:nth-child(3)").prop('selected', true);
});

Ответ написан более трёх лет назад

Комментировать

Как при клике на видео растягивать его на все доступное пространоство?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

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

Ответ написан более трёх лет назад

Комментировать

Как поставить несколько редакторов кода ace на страницу?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Вам не обязательно передавать ID в .edit(). Вы можете передавать элемент:

let editors = document.querySelectorAll('.editor'); //Парсим все элементы с классом "editor"

editors.forEach(function(e) { //Каждому такому элементу создаём редактор
    const editor = ace.edit(e);
    editor.setTheme("ace/theme/monokai");
    editor.session.setMode("ace/mode/html");
});

Вместо id просто указываете class="editor".

Ответ написан более трёх лет назад

3 комментария

Как правильно верстать такие блоки на bootstrap?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Ну, вообще, в том, что вы написали нет ничего противозаконного. Просто, это не очень хороший стиль. Куда лучше написать вот так:

<div class="row">
  <div class="col-12">
    <h1>We are awesome creative agence</h1>
    <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quo, magni!</p>
  </div>
</div>

А отступ задать через заранее созданный классы с margin'ами, или в CSS дописать.
Всегда думайте о том, чтобы использовать как можно меньше тегов. Многие очень грешат тем, что делают по несколько div'ов там, где они вообще не нужны. Это улучшает читаемость кода, оптимизирует работу браузера/JavaScript и снижает вес страницы.

Ну и да, вам на такой простой блок колонки бутстрапа не сдались, действительно. Можете вообще сократить до:

<h1>We are awesome creative agence</h1>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quo, magni!</p>

Если же вас интересует контейнер - дело другое.

Ответ написан более трёх лет назад

Комментировать

Как сделать форму с одной кнопкой и редиректом?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

header("Location: https://code.patriotovsky.ru/"); //Учитывайте, что до этой записи не должны быть использованы echo или print'ы.
die();

Ответ написан более трёх лет назад

6 комментариев

Как в Bootstrap 4.3.1 растянуть колонку по высоте до конца страницы чтобы не появлялась полоса прокрутки?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Используйте функцию свойства - calc(). 100% минус высота navbar. Так же, можно использовать не %, а 100vh - что всегда равно 100% высоты экрана.

<nav class="navbar navbar-light bg-light">
    <a class="navbar-brand" href="#">Navbar</a>
</nav>

<div class="container-fluid d-flex flex-column" style="height: calc(100% - 56px)">
    <div class="row bg-light flex-fill d-flex justify-content-start">
        <div class="col-4 bg-secondary">
            Content
        </div>
        <div class="col-8 bg-success">
            Content
        </div>
    </div>
</div>

Ответ написан более трёх лет назад

3 комментария

Из-за чего не работает before и after?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

У inline-элементов не бывает before или after.
Вы можете сделать span с display: inline-block; и всё заработает.

Ответ написан более трёх лет назад

3 комментария

Позиционирование кнопок навигации внутри слайдера (owl-carousel)?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Лениво писать код, вот пример: https://freakyjolly.com/demo/jquery/OwlCarousel2/
Кнопки туда-сюда - это отдельные элементы. .owl-nav - это их враппер, а внутри там есть свои .nav-btn туда и обратно. Т.е. ещё два блока. Как раз таки .nav-btn и нужно позиционировать через position: absolute. Слева и справа.

Ответ написан более трёх лет назад

Комментировать

Как браузеру прочесть минифицированный css файл?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

HTML тоже можно минифицировать. Вопрос в скорости и в том, что сайт динамичный и каждый раз его нужно переминифицировать.

CSS и JS скрипты могут быть минифицированными, это никак не влияет на работу браузера. Просто, код из типа:

function test(num) {
  return 2 + num;
}

Становится менее читаемым для ЧЕЛОВЕКА, но более компактным:
function test(t){return 2+t}

Машине всё равно чё там читать, ~~у неё нет чувств.~~

Ответ написан более трёх лет назад

4 комментария

Почему расширяется поле ввода при добавлении одного символа?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Скорее всего, скрипты у вас какие-то подключены для этого.
Можете воткнуть костыль в виде max-heigth свойства для textarea.

Ответ написан более трёх лет назад

Комментировать

Как использовать тег cut?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Смотрите гайд по CSS и HTML здесь: htmlbook.ru/blog/obrezaem-dlinnuyu-stro
Тега не существует.
С помощью JavaScript/jQuery можно так же сделать полное раскрытие текста при клике, убрав ненужные правила CSS.

Ответ написан более трёх лет назад

1 комментарий

Как в input при вводе делать авто замену символа ' на ’?

Антон Неверов @TTATPuOT

https://code.patriotovsky.ru/

Пример с использованием jQuery:

$("input").on('keyup', function() {
	let value = $(this).val();
	$(this).val(value.replace("'", '’'));
});

Ответ написан более трёх лет назад

6 комментариев

Войдите на сайт