Векторная графика для начинающих: теория и практика технического дизайна — страница 19 из 31

"btn" target="_blank"
      download title="Download image in PNG">PNG
      download title="Download image in SVG">SVG

  …

Состояние A

Веб-интерфейс поиска по умолчанию

Состояние B

Веб-интерфейс поиска при запросе

Рисунок 16.5 – Состояния веб-интерфейса (по умолчанию и при запросе по ключевому слову)

2. В редакторе Note++ создать новый файл и заполнить его исходным кодом практикума:

Практикум №6. Search Page
</code></pre></p><p><pre><code>        $(function(){</code></pre></p><p><pre><code>          $("input#search").on("input",function(){</code></pre></p><p><pre><code>          var a=$(this).val().toLowerCase();</code></pre></p><p><pre><code>          if(a.length<=2){$("ul.searchResults li").show()</code></pre></p><p><pre><code>        }</code></pre></p><p><pre><code>        else {</code></pre></p><p><pre><code>          $("ul.searchResults li").each(function(){</code></pre></p><p><pre><code>             if($(this).text().toLowerCase().indexOf(a)<0){$(this).hide()</code></pre></p><p><pre><code>         }})</code></pre></p><p><pre><code>      }})</code></pre></p><p><pre><code>   });</code></pre></p><p><pre><code>
Show in dark-mode
</code></pre></p><p><pre><code>  jQuery('.darkMode').click(function(){</code></pre></p><p><pre><code>   jQuery('body').toggleClass('darkUI');</code></pre></p><p><pre><code>   jQuery('#search').toggleClass('darkUI');</code></pre></p><p><pre><code>   jQuery('.searchResults').toggleClass('darkUI');</code></pre></p><p><pre><code>   jQuery('.darkMode').toggleClass('lightUI');</code></pre></p><p><pre><code>  });</code></pre></p><p><pre><code>
Abstract flower and bud

      alt="" class="previewImg">
            target="_blank" title="Download image in PNG">PNG
            class="btn" target="_blank" title="Download image in SVG">SVG
Astra flower & plant

PNG
SVG
Beauty of bud and flower astra

            target="_blank" title="Download image in PNG">PNG
SVG
Blue bud of flower and branch

PNG
SVG
Blue flower and green plant in nature

PNG
SVG
Blue and violet flower and plant in nature

PNG
SVG
Bud flower astra or rose in nature

PNG
SVG
Bud of flower (nice beauty of astra)

PNG
SVG
Flower Rowan

PNG
SVG
Flower pot and natural eco garden

      alt="" class="previewImg">