snipt

Ctrl+h for KB shortcuts

HTML

Onenote/Web - JS PHP/jQuery/code snippets

<script type="text/javascript" src="..."></script>
<script type="text/javascript">
    $(document).ready( function(){
    	alert("Hello JQuery World!");
    	Window.console && console.log('Hello JQuery...');
    });
    $(window).resize( function(){
    	Console.log('.resize() called. Width='+$(window).width()+' height='+$(window).height());
    });
</script>

<p id="para">Where is the spinner?
	<img id="spinner" src="…" height="25" style="vertical-align: middle; display:none;">
</p>
<a href="#" onclick="$('#spinner').toggle(); return false;">Toggle</a>
<a href="#" onclick="$('#para').css('background-color', 'red'); return false;">Red</a>
<a href="#" onclick="$('#para').css('background-color', 'green'); return false;">Green</a>
https://snipt.net/embed/7863320f62a7f6b3bb505ae3924bc9ce/
/raw/7863320f62a7f6b3bb505ae3924bc9ce/
7863320f62a7f6b3bb505ae3924bc9ce
html
HTML
17
2019-06-18T13:21:01
True
False
False
/api/public/snipt/148262/
haha-7be3bc0e
<table class="highlighttable"><tr><td class="linenos"><div class="linenodiv"><pre><a href="#L-1"> 1</a> <a href="#L-2"> 2</a> <a href="#L-3"> 3</a> <a href="#L-4"> 4</a> <a href="#L-5"> 5</a> <a href="#L-6"> 6</a> <a href="#L-7"> 7</a> <a href="#L-8"> 8</a> <a href="#L-9"> 9</a> <a href="#L-10">10</a> <a href="#L-11">11</a> <a href="#L-12">12</a> <a href="#L-13">13</a> <a href="#L-14">14</a> <a href="#L-15">15</a> <a href="#L-16">16</a> <a href="#L-17">17</a></pre></div></td><td class="code"><div class="highlight"><pre><span></span><span id="L-1"><a name="L-1"></a><span class="p">&lt;</span><span class="nt">script</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;text/javascript&quot;</span> <span class="na">src</span><span class="o">=</span><span class="s">&quot;...&quot;</span><span class="p">&gt;&lt;/</span><span class="nt">script</span><span class="p">&gt;</span> </span><span id="L-2"><a name="L-2"></a><span class="p">&lt;</span><span class="nt">script</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;text/javascript&quot;</span><span class="p">&gt;</span> </span><span id="L-3"><a name="L-3"></a> <span class="nx">$</span><span class="p">(</span><span class="nb">document</span><span class="p">).</span><span class="nx">ready</span><span class="p">(</span> <span class="kd">function</span><span class="p">(){</span> </span><span id="L-4"><a name="L-4"></a> <span class="nx">alert</span><span class="p">(</span><span class="s2">&quot;Hello JQuery World!&quot;</span><span class="p">);</span> </span><span id="L-5"><a name="L-5"></a> <span class="nx">Window</span><span class="p">.</span><span class="nx">console</span> <span class="o">&amp;&amp;</span> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;Hello JQuery...&#39;</span><span class="p">);</span> </span><span id="L-6"><a name="L-6"></a> <span class="p">});</span> </span><span id="L-7"><a name="L-7"></a> <span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">resize</span><span class="p">(</span> <span class="kd">function</span><span class="p">(){</span> </span><span id="L-8"><a name="L-8"></a> <span class="nx">Console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s1">&#39;.resize() called. Width=&#39;</span><span class="o">+</span><span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">width</span><span class="p">()</span><span class="o">+</span><span class="s1">&#39; height=&#39;</span><span class="o">+</span><span class="nx">$</span><span class="p">(</span><span class="nb">window</span><span class="p">).</span><span class="nx">height</span><span class="p">());</span> </span><span id="L-9"><a name="L-9"></a> <span class="p">});</span> </span><span id="L-10"><a name="L-10"></a><span class="p">&lt;/</span><span class="nt">script</span><span class="p">&gt;</span> </span><span id="L-11"><a name="L-11"></a> </span><span id="L-12"><a name="L-12"></a><span class="p">&lt;</span><span class="nt">p</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;para&quot;</span><span class="p">&gt;</span>Where is the spinner? </span><span id="L-13"><a name="L-13"></a> <span class="p">&lt;</span><span class="nt">img</span> <span class="na">id</span><span class="o">=</span><span class="s">&quot;spinner&quot;</span> <span class="na">src</span><span class="o">=</span><span class="s">&quot;…&quot;</span> <span class="na">height</span><span class="o">=</span><span class="s">&quot;25&quot;</span> <span class="na">style</span><span class="o">=</span><span class="s">&quot;vertical-align: middle; display:none;&quot;</span><span class="p">&gt;</span> </span><span id="L-14"><a name="L-14"></a><span class="p">&lt;/</span><span class="nt">p</span><span class="p">&gt;</span> </span><span id="L-15"><a name="L-15"></a><span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;#&quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;$(&#39;#spinner&#39;).toggle(); return false;&quot;</span><span class="p">&gt;</span>Toggle<span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span> </span><span id="L-16"><a name="L-16"></a><span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;#&quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;$(&#39;#para&#39;).css(&#39;background-color&#39;, &#39;red&#39;); return false;&quot;</span><span class="p">&gt;</span>Red<span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span> </span><span id="L-17"><a name="L-17"></a><span class="p">&lt;</span><span class="nt">a</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;#&quot;</span> <span class="na">onclick</span><span class="o">=</span><span class="s">&quot;$(&#39;#para&#39;).css(&#39;background-color&#39;, &#39;green&#39;); return false;&quot;</span><span class="p">&gt;</span>Green<span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span> </span></pre></div> </td></tr></table>
--- 
+++ 
@@ -1,6 +1,3 @@
-<!-------------------------->
-		<!--jQuery-->
-<!-------------------------->
 <script type="text/javascript" src="..."></script>
 <script type="text/javascript">
     $(document).ready( function(){
@@ -10,4 +7,11 @@
     $(window).resize( function(){
     	Console.log('.resize() called. Width='+$(window).width()+' height='+$(window).height());
     });
-</script>+</script>
+
+<p id="para">Where is the spinner?
+	<img id="spinner" src="…" height="25" style="vertical-align: middle; display:none;">
+</p>
+<a href="#" onclick="$('#spinner').toggle(); return false;">Toggle</a>
+<a href="#" onclick="$('#para').css('background-color', 'red'); return false;">Red</a>
+<a href="#" onclick="$('#para').css('background-color', 'green'); return false;">Green</a>
--- 
+++ 
@@ -0,0 +1,13 @@
+<!-------------------------->
+		<!--jQuery-->
+<!-------------------------->
+<script type="text/javascript" src="..."></script>
+<script type="text/javascript">
+    $(document).ready( function(){
+    	alert("Hello JQuery World!");
+    	Window.console && console.log('Hello JQuery...');
+    });
+    $(window).resize( function(){
+    	Console.log('.resize() called. Width='+$(window).width()+' height='+$(window).height());
+    });
+</script>