Ответы пользователя по тегу HTML
  • С чего начать разработку SIP клиента из браузера? Какой SIP сервер выбрать и как настраивать?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Возможно я вас не правильно понял, но существуют ведь готовые решения, позволяющие звонить, принимать звонки, записывать разговор а потом прослушивать в .mp3
    И это далеко не всё. Естественно данное удовольствие платное и работает через API.
    Bitrix24 например использует Mango Office.
    Если вам нравится как это работает (не с точки зрения функционала CRM а Mango Office), тогда установите на свой сайт.
    Документация доступная и понятная. Есть и другие кто предоставляет такую возможность. Что подходит вам, решать только Вам. Если хотите своё, то изучите curl - без него и близко туда соваться не советую, его на вашем сервере может и не быть. Я столкнулся с этим когда тестировал Stripe и PayPal - через curl оказывается безопасно обмениваться данными. Плюс, вы можете тестировать и запускать это через консоль, что крайне удобно при тестах, а вникать что там за ошибки на странице вылезли, это потом уже, когда с серверной частью разберётесь. Думаю, вам так же будет по хорошему сделать своё API чтобы делать запросы к серверу. Плюс в будущем это свобода для интеграции в мобильные приложения. Успехов.
    Ответ написан
  • Как обратиться к объекту :after элемента Jquery?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Например, так:
    $('p').on('click', function () {
        $(this).attr('data-before','bar');
    });


    p:before {
        content: attr(data-before);
        color: red;
        cursor: pointer;
    }


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
    Ответ написан
    Комментировать
  • Как сделать плавную прокрутку страницы до якоря?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Такая конструкция подойдёт всем, у кого есть выпадающие меню с ссылкой
    Чтобы не цеплять выпадающие меню и коллапсы, используйте класс или id
    который будет указывать на разрешение скролла
    $("a.youe_class").click(function() { 
    ...
    });


    Такой подход подойдёт, если без разницы, если в ссылке решётка, или там ссылка, просто будет скроллить к нужному блоку с id
    $("a").click(function() { 
    ...
    });


    <p><a href="#top">К началу страницы</a></p>
    <section id="top">
    ...
    </section>


    $(document).ready(function() {
       var margin = 100; // переменная для контроля докрутки
       $("a").click(function() { // тут пишите условия, для всех ссылок или для конкретных
          $("html, body").animate({
             scrollTop: $($(this).attr("href")).offset().top+margin+ "px" // .top+margin - ставьте минус, если хотите увеличить отступ
          }, {
             duration: 1600, // тут можно контролировать скорость
             easing: "swing"
          });
          return false;
       });
    });
    Ответ написан
    Комментировать
  • Кнопка "Показать еще" через Ajax или display: none?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Можно так:
    <script>
    $( 'button' ).click(function() {
      if ( $( "#box" ).is( ":hidden" ) ) {
        $( "#box" ).show( "slow" );
      } else {
        $( "#box" ).slideUp();
      }
    });
    </script>


    <button>показать ещё</button>
    <div id="box">тут картинки</div>


    Если картинки тяжёлые, по мегабайту каждая или более, лучше через:
    else ...
    $( "#box" ).load( "ajax/image.html  #target" );
    ...

    <div id="box">
          <div id="target"></div>
    </div>
    Ответ написан
    Комментировать
  • Проверка оптимизации для мобильных криво видет страницу?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Пользуйтесь - www.responsinator.com
    Помогает увидеть всю картину целиком.
    И охват устройств лучше сделать так:
    @media screen and (max-width:767px) {
    
    }
    @media screen and (min-width:768px) and (max-width:991px) {
       
    }
    @media screen and (min-width:992px) and (max-width:1199px) {
      
    }
    @media screen and (min-width: 1200px) {
     
    }

    Тогда вы захватываете все размеры разом.
    Ответ написан
    Комментировать
  • Может ли Python заменить php?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Мне кажется, что когда спрос на разработку нейросетей и искусственного интеллекта будет более высок, и робототехника будет доступна на уровне пылесосов и мобильников, тогда будет очень большой спрос на питон, пока что этот трон занимает php, но на пятки наступает javascript.
    Так что да, Python очень даже может заменить php, к 2020 и особенно к 2045 году - думаю, особенно.
    Ответ написан
    1 комментарий
  • Как изменить фон выпадающего списка select'а, то есть фон option?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Здравствуйте.
    Не знаю, как помогу вам, но подскажу, что копать надо в сторону селекторов для браузеров,читайте черновики по css, ещё это можно решить через javascript, а вообще на каждый html тег есть свои псевдоклассы, смотрите в каких браузерах и платформах это работает, потому что ещё не во всех поддерживается.
    Вот интересная ссылка css-live.ru/articles-css/spisok-psevdoelementov-dl...
    Помните о кроссбраузерности.
    Ответ написан
    Комментировать
  • Как сделать разлет картинок из центра по краям после задержки?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Здравствуйте.
    Если вы хорошо владеете javascript, то предлагаю воспользоваться "Зелёным Шоком"
    Этот фреймворк делает различные сложные анимации, может пригодится во многих интересных и сложных проектах, на ютубе есть много видео о нём, хоть и на английском, но у них полно примеров на codepen, так что - Welcome )))

    https://greensock.com
    Ответ написан
    3 комментария
  • Как сделать каждому checkbox свой input в Yii2?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Используйте "checkboxTemplate" - он тут больше к месту:
    $checkboxTemplate = "<div class=\"checkbox\">\n{beginLabel}\n{input}\n{labelTitle}\n{endLabel}\n{error}\n{hint}\n</div>"


    <?= $form->field($model, 'email', $checkboxTemplate)->textInput();?>


    www.yiiframework.com/doc-2.0/yii-bootstrap-activef...
    Ответ написан
    Комментировать
  • Как воспроизвести rtmp от 101.ru на стороннем сайте?

    Isolution666
    @Isolution666
    Full-Stack Developer
    1) Установка flash плеера 101.ru на свой сайт.
    2) Установка javascript кода 101.ru на свой сайт.
    3) Решить вопросы с директориями
    4) Решить вопрос с SSL-сертификатом
    5) Постоянно следить за обновлениями сайта, чтобы ваше радио работало 24/7
    6) Возможно придётся сделать некий свой API или иной метод, который бы возвращал исходный код плеера с чужого сайта.

    Если кто не знал, сайт 101.ru использовал плагин плеера с uppod.com, так что, изучите документацию, может сделаете своё собственное радио. В любом случае успехов вам.
    Ответ написан
    Комментировать
  • Как в bootstrap изменить размер экрана при сжатии меню?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Используй @media screenтут подробно изложено как этим пользоваться, так же советую использовать responsinator, если используете OpenServer, то через него тоже можно заняться адаптацией. Советую использовать 4 параметра, как предлагает сам bootstrap

    Очень маленькие устройство
    Телефоны (<768px)

    Малые устройства
    Планшеты (≥768px)

    Средние устройства
    Настольные (≥992px)

    Большие устройства
    Настольные (≥1200px)
    Ответ написан
    Комментировать
  • Тег br не работает в FireFox?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Не знаю что и сказать на это )) Браузеры уже давно стали головной болью для программистов.
    Есть ещё вот такой способ:
    <pre>
           <strong>
                  ул. Дмитрия Мартынова, 47
                  2-40-40-93, 2-415-818
           </strong>
       </pre>

    тег <pre> ещё никто не отменял, он позволяет отображать переносы без <br/> если они в тексте на самом деле есть.

    Интересное решение предлагает bootstrap
    <address>
      <strong>Twitter, Inc.</strong><br>
      795 Folsom Ave, Suite 600<br>
      San Francisco, CA 94107<br>
      <abbr title="Phone">P:</abbr> (123) 456-7890
    </address>
    
    <address>
      <strong>Full Name</strong><br>
      <a href="mailto:#">first.last@example.com</a>
    </address>


    bootstrap-3.ru/css.php#type-addresses

    Почему-то применяя этот фреймворк, проблем с <br> нет. Ну и на крайний случай, старайтесь избегать этого тега. Сейчас к нему относятся с презрением, так как всё решает css3
    К примеру, у вас есть текст, который надо разбивать на три колонки, при выведении из базы данных. Принуждать пользователя чертить html теги таблицы <table> ??? Табличная вёрстка тоже уходит в прошлое, как страшный сон, что же делать? А очень просто, у css есть такой параметр, который формирует столбцы siteis.ru/html-i-css-retsepty/razbivka-teksta-na-k... , и по желанию их может быть и больше и меньше, эту ситуацию реально обыграть и в адаптивной вёрстке. Сделать одну колонку, если сайт смотрят с мобильного устройства. Как видите, способов переноса масса, и даже не нужен <br>, учите css - и жизнь будет радостнее и легче.
    Ответ написан
    2 комментария
  • Есть ли замена iframe?

    Isolution666
    @Isolution666
    Full-Stack Developer
    всё очень просто!
    Надо помнить, что главными в вопросах вёрстки - айдишники, а второстипенные - классы!
    #text {
          color:#000;
    }
    .text {color:#fff;}

    если в блоке есть класс, но стоит айди, то цвет текста будет чёрный а не белый
    <div id="text">
         <div class="text">Здесь сам текст</div>
    </div>


    Есть ещё одна вещь!! С ней не поспорит не один стиль! ))
    .text {color:#0ff !important;}
    Применяем импортант, если хотим увеличить важность стиля, и всё, избавьтесь от iframe как от скверны, фреймы причиняют только вред сайту, к тому же, перед скачиванием Twitter Bootstrap вы можете настроить только те элементы, которые вам нужны, выбрать только то что нужно, в том числе и поменять цвета.

    От себя как от веб-дизайнера скажу, что если ваш сайт содержит серьёзный контент, то нет места разношёрстным стилям, всё должно быть строго и лаконично, минимум 3 цвета, минимум 2 шрифта.

    Размеры тоже должны быть одинаковыми, что у текстов что у заголовков, если текст везде 12pt , то не должно быть страниц с текстом другого размера, внутри текста могут быть: цитата или пояснение какое (чтобы выделить их, поменяйте цвет или размер). Аналогично с заголовками, и они должны быть жирнее и больше. Это не моя прихоть, это для удобства чтения )) Надеюсь помог.
    Ответ написан
  • Как сделать доступными медиафайлы только для некоторых пользователей сайта?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Есть два способа, как ограничивать доступ к контенту.

    1) уровень доступа
    2) возрастное ограничение
    в первом случае уровень доступа присваивается автоматически, при регистрации, например, столбец в базе данных будет называться level и значение по умолчанию = 1 (выставить прямо в БД), в админке можно менять этот уровень например на = 2, или автоматизировать, если пользователь больше месяца зарегистрирован на вашем сайте, то level = 2 нужна функция update для MySQL
    соответственно нужно помнить про столбец даты регистрации, чтобы иметь переменную (точку отсчёта), либо создать фильтр вип клиентов, если клиент не вип, то скрыть, чтобы он стал вип клиентом установи платёжную систему, чуточку по сложнее, но тут плюсов больше! ))


    Что касается второго варианта, тут по больше головников, дело в том что дату рождения здесь нужно указывать сразу и обязательно, при регистрации, либо в личном кабинете, в противном случае он не сможет пользоваться сайтом, в инете найдёшь функцию вычисляющую возраст, но большой плюс в том, что если есть контент 18+ , то вы застрахованы от иска в суд за публичный контент для несовершеннолетних (вопрос нравственности)



    Вопрос вовсе не глупый, думайте, какая задача стоит, исходя из задачи, получится решение, два из них я описал
    Ответ написан
    Комментировать
  • Как правильно сделать прилипающий к верху и низу компонент?

    Isolution666
    @Isolution666
    Full-Stack Developer
    Ваше решение чётко расписала известная интернет-блоггерша Наталья
    shpargalkablog.ru/2013/09/scroll-block.html

    Читайте и экспериментируйте, у вас всё получится! )))

    Пример: sticky01.blogspot.ru/2013/09/4.html
    Ответ написан
    2 комментария