Ответы пользователя по тегу HTML
  • Как сделать кнопку-ссылку после нажатия которой она становится неактивной?

    @frees2
    На CSS, просто скрыть кнопку после нажатия.
    Ответ написан
    Комментировать
  • Почему в Google chrome пропадают стили при внутренней прокрутке position: fixed элемента?

    @frees2
    Возможно, с подобным сталкивался при раскрытии списков. Просто поставьте между блоками прокрутки
    <div style="clear: both; "></div>
    Ответ написан
    Комментировать
  • Как корректно настроить filter: blur?

    @frees2
    Если вы фон хотите сделать, не пойму, в которjм содержимое?
    Стеклянный фон можно так.
    https://jsfiddle.net/igord/jgunvkxp/1/
    Ответ написан
  • Как сделать редирект на другую страницу после успешной отправки формы с помощью js?

    @frees2
    Лучше через php
    }else { header( 'Location: /user.php?uid=тут куда отправлять типо... если правильное или не правильное, если правильное поле то' делаем задержку с нужным временем, к примеру на 200 секунд, true, 303 ); } ;
    Почему через php, ради безопасности.
    Ответ написан
    Комментировать
  • Как запустить скрипт по клику?

    @frees2
    Вы можете просто его подгрузить при клике или мышью onmouseover=" load(event)".
    function load(event) {
    method: 'post'
    В подгруженой страничке скрипт, примеры в тырнете.
    Ответ написан
    Комментировать
  • От чего возникает ошибка в PHP?

    @frees2
    <?phpphp поставьте классическая ошибка
    Ответ написан
    Комментировать
  • Обьясните новичку про javascript?

    @frees2
    class=highlight
    var locat111111 =\'<a href=\x22#\x22 class=\x22ssssss\x22 
    <a href=\x27#\x27 class=\x27your\x27

    Теги лучше ставить такие если в php вставляете.
    Ответ написан
  • Как остановить видео в слайдере с ютуба при преходе на следующее?

    @frees2
    Карусель из плейеров - глупость, сделайте кнопки см. googleapis youtube
    Ответ написан
    Комментировать
  • Что означает код: .\31 u\24?

    @frees2
    <a href=\x22#\x22 id=\x22
    ----------------
    Может вроде замены?
    Ответ написан
  • Как сделать выпадающий список?

    @frees2
    Выпадающий вниз, или из блоков по клику на ссылку? Если вниз то так.

    <style>
      .cards {  display: flex; flex-wrap: wrap;  align-items: stretch;  }
      .card {  flex: 0 0 20%;  margin: 0px;  border: 0;  } 
      .card .text { padding: 0 2px 2px;  }
      
    </style>
    
    <main class="cards">
      <article class="card"> <div class="text">
       1 cccccccccccccc
    </div></article>
      
      <article class="card"> <div class="text">
       2  ccccccccccccccccc
    </div></article>
      
      
    </main>
    Ответ написан
  • Отображение блока при наведении CSS?

    @frees2
    <button type="button" onmouseover="loadDoc2(); this.style.display='none';return false">открыть список каналов</button>
    <ul> </ul>
    <script> function loadDoc2(){var myList = document.querySelector('ul');fetch('products.json').then(function(response) { return response.json(); })
    .then(function(json) { for(var i = 0; i < json.products.length; i++){var listItem = document.createElement('li');
    listItem.innerHTML = '<strong>' + json.products[i].Name + '</strong>';
    listItem.innerHTML +=' can be found in ' + json.products[i].Location + '.';
    listItem.innerHTML +=' Cost: <strong>?' + json.products[i].Price + '</strong>';
    myList.appendChild(listItem); 
     } })};
      </script>
    Ответ написан
    Комментировать
  • Что это за эффект css у блока?

    @frees2
    Фиксация (нажатия) ссылки, кнопки как улучшить?
    Писал же, спрашивал, так игнорируют, сложность почему то поменяли со сложной на среднюю...
    Работает во всех браузерах, тени тоже работают.
    Можно поиграться с тенями и фоном ( и без блока, можно с блоком)
    button,[role="button"] {cursor: pointer;}
    button[aria-pressed="true"],[role="button"][aria-pressed="true"] {  background-color:  #CAE8CA; transition-property: background-color;transition-duration: 0.4s;}
    
    :active, :hover, :focus { outline: 0; outline-offset: 0;}
    button[aria-pressed="true"],[role="button"][aria-pressed="true"]:focus  {     background-color:   rgba(204,204,255, 0.9);}
    [role="button"]:active { background-color: #bbb;}
    Ответ написан
    Комментировать
  • Как сделать смену url без перезагрузки?

    @frees2
    Не совсем достаточное решение у Abigovor Abigovor.
    Пример работающий, но надо ещё заголовок прописать, ибо он передаваться не будет так в некоторых даже новых браузерах.
    1 Пример демо ссылки недостаточный
    echo '<a href="'.$id.'" ><span  onclick="player.loadVideoById(\''.$id.'\',0);history.pushState(\''.$id.'\',null, \''.$id.'\');return false">.................

    2 Достаточный с заголовком document.title
    <span onclick="player.loadVideoById(\''.$videoId.'\', 0);history.pushState(\''.$videoId.'\', null, \''.$videoId.'\');document.title = \''.$title3.'\';return false">.......................

    Ну и надо будет
    <IfModule mod_rewrite.c>
        RewriteEngine On
        RewriteBase /
        RewriteRule ^v/index\.php$ - [L]
        RewriteCond %{REQUEST_FILENAME} !-f
        RewriteCond %{REQUEST_FILENAME} !-d
        RewriteRule . v/index.php [L]
     </IfModule>
    Ответ написан
    Комментировать
  • Как сделать выпадающее меню?

    @frees2
    var idVhod = document.getElementById('idVhod'); function onclickVhod() { idVhod.style.display = (idVhod.style.display == 'inline') ? '' : 'inline';
    localStorage.setItem('hide', idVhod.style.display);}if(localStorage.getItem('hide') == 'inline') { document.getElementById('idVhod').style.display = 'inline'; setTimeout(onclickVhod, 5700)}; 
      
    // window.localStorage.clear();


    #idVhod {position: fixed; z-index: 100;  top:  3em;   left:  0.3em;  display: none;   background-color: rgba(255,255,255,.9);   padding: 0 0.6em 0.6em 0.8em;margin: 0.1em; box-shadow: rgba(0, 0, 128, 0.2) 0.3em -0.3em 0.7em;border-radius: 0.2em;  }
     .Vhod {cursor: pointer; padding: 0 ; display: inline-block;  border: 2px solid #efefef; border-radius: 20%;margin: 8px;background-color: rgba(255,255,255,.4);}
     .Vhod:hover {opacity: 0.7;}


    <span class="Vhod" onclick="onclickVhod()"><img  src="24px.svg"> </span> <span  id="idVhod"> ggggggggggggggg11111111<span class="Vhod" onclick="onclickVhod()"> x</span><br>
    gggggggggggggggggggggg
    </span>
    Ответ написан
    Комментировать
  • Что за js или это не js?

    @frees2
    Так работает
    <nav><ul><li  tabindex="1"><a data-page="page1">1  страница</a></li>...........

    var myArticle = document.querySelector('article'); var myLinks = document.querySelectorAll('nav ul a'); for(var i = 0; i <= myLinks.length - 1; i++) {
    myLinks[i].onclick = function(e) {e.preventDefault();var linkData = e.target.getAttribute('data-page'); getData(linkData); } };
    ......................
    Ответ написан
  • Как сделать табы (начальный вид только с помощью стилей)?

    @frees2
    <style type='text/css'>
    
    
    
    section {  display: none;  padding:  0;  border-top: 1px solid #ddd; } input {   display: none;}
    label {  display: inline-block;  margin: 0 0 -1px;  padding: 2px 2px;  border: 1px solid gray ;  border-radius: 4px 4px 0 0;  }
    label:before {   font-weight: normal;  margin-right: 5px; } label:hover {  color: #888;  cursor: pointer; }
    input:checked + label {  color: #555;  border: 1px solid #ddd;  border-top: 2px solid #D3D3D3;  border-bottom: 1px solid #fff; }
    
    #tab1:checked ~ #content1,
    #tab2:checked ~ #content2,
    #tab3:checked ~ #content3,
    #tab4:checked ~ #content4 
    {  display: block;}
    
    
    
      </style>
      
    
      
    </head>
    
    <body>
    
      
     
    
       <input id="tab1" type="radio" name="tabs" checked> <label for="tab1">C</label>
       <input id="tab2" type="radio" name="tabs">  <label for="tab2">D</label>
       <input id="tab3" type="radio" name="tabs">  <label for="tab3">D</label>
       <input id="tab4" type="radio" name="tabs">  <label for="tab4">D</label>
     
      <section id="content1">
        <p>
          Bacon ipsum dolor sit amet beef venison beef ribs kielbasa. Sausage pig leberkas, t-bone sirloin shoulder bresaola. Frankfurter rump porchetta ham. Pork belly prosciutto brisket meatloaf short ribs.
        </p>
        <p>
          Brisket meatball turkey short loin boudin leberkas meatloaf chuck andouille pork loin pastrami spare ribs pancetta rump. Frankfurter corned beef beef tenderloin short loin meatloaf swine ground round venison.
        </p>
      </section>
        
      <section id="content2">
        <p>
          Bacon ipsum dolor sit amet landjaeger sausage brisket, jerky drumstick fatback boudin ball tip turducken. Pork belly meatball t-bone bresaola tail filet mignon kevin turkey ribeye shank flank doner cow kielbasa shankle. Pig swine chicken hamburger, tenderloin turkey rump ball tip sirloin frankfurter meatloaf boudin brisket ham hock. Hamburger venison brisket tri-tip andouille pork belly ball tip short ribs biltong meatball chuck. Pork chop ribeye tail short ribs, beef hamburger meatball kielbasa rump corned beef porchetta landjaeger flank. Doner rump frankfurter meatball meatloaf, cow kevin pork pork loin venison fatback spare ribs salami beef ribs.
        </p>
        <p>
          Jerky jowl pork chop tongue, kielbasa shank venison. Capicola shank pig ribeye leberkas filet mignon brisket beef kevin tenderloin porchetta. Capicola fatback venison shank kielbasa, drumstick ribeye landjaeger beef kevin tail meatball pastrami prosciutto pancetta. Tail kevin spare ribs ground round ham ham hock brisket shoulder. Corned beef tri-tip leberkas flank sausage ham hock filet mignon beef ribs pancetta turkey.
        </p>
      </section>
        
      <section id="content3">
        <p>
          Bacon ipsum dolor sit amet beef venison beef ribs kielbasa. Sausage pig leberkas, t-bone sirloin shoulder bresaola. Frankfurter rump porchetta ham. Pork belly prosciutto brisket meatloaf short ribs.
        </p>
        <p>
          Brisket meatball turkey short loin boudin leberkas meatloaf chuck andouille pork loin pastrami spare ribs pancetta rump. Frankfurter corned beef beef tenderloin short loin meatloaf swine ground round venison.
        </p>
      </section>
        
      <section id="content4">
        <p>
          Bacon ipsum dolor sit amet landjaeger sausage brisket, jerky drumstick fatback boudin ball tip turducken. Pork belly meatball t-bone bresaola tail filet mignon kevin turkey ribeye shank flank doner cow kielbasa shankle. Pig swine chicken hamburger, tenderloin turkey rump ball tip sirloin frankfurter meatloaf boudin brisket ham hock. Hamburger venison brisket tri-tip andouille pork belly ball tip short ribs biltong meatball chuck. Pork chop ribeye tail short ribs, beef hamburger meatball kielbasa rump corned beef porchetta landjaeger flank. Doner rump frankfurter meatball meatloaf, cow kevin pork pork loin venison fatback spare ribs salami beef ribs.
        </p>
        <p>
          Jerky jowl pork chop tongue, kielbasa shank venison. Capicola shank pig ribeye leberkas filet mignon brisket beef kevin tenderloin porchetta. Capicola fatback venison shank kielbasa, drumstick ribeye landjaeger beef kevin tail meatball pastrami prosciutto pancetta. Tail kevin spare ribs ground round ham ham hock brisket shoulder. Corned beef tri-tip leberkas flank sausage ham hock filet mignon beef ribs pancetta turkey.
        </p>
      </section>
    Ответ написан
    Комментировать
  • Автоматическая загрузка при прокрутке. Можно ли такое сделать? Если да то как?

    @frees2
    Можно гораздо проще сделать. При прокручивании мышь окажется в поле и появится текст. Пример
    <div  id="btn1666">коллекция каналов и роликов</div><div  class="canal"></div>

    $(document).ready(function() { $('#btn1666').hover(function(){ $(this).remove();
    $.getJSON('json/kolleksia.json', function(data) {for(var i=0;i<data.users.length;i++){
    
    $('.canal').append('<br><input type=\"image\" name=\"message\" value=\"'+data.users[i].id+ '\" src=\"'+data.users[i].num+'\"> ' + data.users[i].text + ' <br><br><br>' ).hide().fadeIn(1000); 
    }.......................
    Ответ написан
    Комментировать
  • Как динамически связать название статьи и меню на сайте?

    @frees2
    Определяем запрос - откуда пришли
    /search?q=tramp
    tramp автоматом вставляется в форму Предзагрузка с помощью формы, на примере ajax, другие решения? ( при желании форма сама перегружается),
    форма при открытии сайта на слово tramp делает нужный запрос и через аякс выводит результаты.
    Будь то меню или что иное.
    Ответ написан
    Комментировать
  • Как сделать адаптивную картинку фоном?

    @frees2
    .container > div > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    }
    Css-свойство object-fit определяет, как содержимое изменяемого элемента должно заполнять контейнер относительно его высоты и ширины.
    Ответ написан