Форум

vikey · #1 (**permalink**) 26.04.2016, 11:39

Передо мной стоит следующая задача:
Пользователь отрывает странице на которой нужно выбрать в select2 опцию. Я хочу сделать так, чтобы при открытии этой страницы select2 выделялся (рамкой, например красного цвета) и выскакивала подсказка , что нужно выбрать здесь для отображения точной инфы.

Ребята я новичок и не могу найти нигде решение которое бы мне подошло. Помогите хотя бы в какую стороны рыть или с помощью чего это можно сделать.

Dilettante_Pro · #2 (**permalink**) 26.04.2016, 17:14

vikey,

<!DOCTYPE html>
<html>
<head>
    <title>Untitled Page</title>
</head>
<style>
    .fx { position: fixed; }
</style>
<script>
    window.addEventListener("DOMContentLoaded", setFixPosition);
    function setFixPosition() {
        var elem = document.querySelector(".fx"),
            html = document.documentElement;
        elem.style.width = "200px";
        elem.style.height = "150px";
        elem.style.left = html.clientWidth/2 - 100 + "px";
        elem.style.top = html.clientHeight/2 - 75 + "px";
        elem.style.border = "2px solid red";
        elem.style.zindex = '100';
        elem.style.background = "white";
        document.getElementById("select2").onchange = function () { elem.style.display="none" }
     };

</script>
<body>
  <table>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
    <tr><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td><td>Много всякой фигни</td></tr>
  </table>
    <div class="fx">
        Обязательно выберите что-нибудь
        <select id="select2">
            <option disabled selected>Выберите вариант</option>
            <option  value="11">первый</option>
            <option  value="22">второй</option>
            <option  value="33">третий</option>
            <option  value="44">четвертый</option>
        </select>
    </div>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript