andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master'

Browse Source
This commit is contained in:
Angelos Chalaris
2017-12-29 00:18:58 +02:00
parent 5ff5d8985a c3725284e2
commit ead7b53ba4
5 changed files with 92 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
docs/index.html
View File

@ -161,9 +161,11 @@
<a class="sublink-1" href="#getscrollposition">getScrollPosition</a>
<a class="sublink-1" href="#geturlparameters">getURLParameters</a>
<a class="sublink-1" href="#hasclass">hasClass</a>
<a class="sublink-1" href="#hide">hide</a>
<a class="sublink-1" href="#httpsredirect">httpsRedirect</a>
<a class="sublink-1" href="#redirect">redirect</a>
<a class="sublink-1" href="#scrolltotop">scrollToTop</a>
<a class="sublink-1" href="#show">show</a>
<a class="sublink-1" href="#toggleclass">toggleClass</a>
<h3>Date
@ -868,6 +870,13 @@ Pass <code>location.search</code> as the argument to apply to the current <code>
</code></pre>
<pre><code class="language-js">hasClass(document.querySelector('p.special'), 'special'); // true
</code></pre>
</div></div><br/><div class="card fluid"><div class="section double-padded"><h3 id="hide">hide</h3></div><div class="section double-padded">
<p>Hides all the elements specified.</p>
<p>Use the spread operator (<code>...</code>) and <code>Array.forEach()</code> to apply <code>display: none</code> to each element specified.</p>
<pre><code class="language-js">const hide = (...el) =&gt; [...el].forEach(e =&gt; (e.style.display = 'none'));
</code></pre>
<pre><code class="language-js">hide(document.querySelectorAll('img')); // Hides all &lt;img&gt; elements on the page
</code></pre>
</div></div><br/><div class="card fluid"><div class="section double-padded"><h3 id="httpsredirect">httpsRedirect</h3></div><div class="section double-padded">
<p>Redirects the page to HTTPS if its currently in HTTP. Also, pressing the back button doesn't take it back to the HTTP page as its replaced in the history.</p>
<p>Use <code>location.protocol</code> to get the protocol currently being used. If it's not HTTPS, use <code>location.replace()</code> to replace the existing page with the HTTPS version of the page. Use <code>location.href</code> to get the full address, split it with <code>String.split()</code> and remove the protocol part of the URL.</p>
@ -898,6 +907,13 @@ Scroll by a fraction of the distance from the top. Use <code>window.requestAnima
</code></pre>
<pre><code class="language-js">scrollToTop();
</code></pre>
</div></div><br/><div class="card fluid"><div class="section double-padded"><h3 id="show">show</h3></div><div class="section double-padded">
<p>Shows all the elements specified.</p>
<p>Use the spread operator (<code>...</code>) and <code>Array.forEach()</code> to clear the <code>display</code> property for each element specified.</p>
<pre><code class="language-js">const show = (...el) =&gt; [...el].forEach(e =&gt; (e.style.display = ''));
</code></pre>
<pre><code class="language-js">show(document.querySelectorAll('img')); // Shows all &lt;img&gt; elements on the page
</code></pre>
</div></div><br/><div class="card fluid"><div class="section double-padded"><h3 id="toggleclass">toggleClass</h3></div><div class="section double-padded">
<p>Toggle a class for an element.</p>
<p>Use <code>element.classList.toggle()</code> to toggle the specified class for the element.</p>