<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>The Filipino Programmer &#187; Jquery</title>
	<atom:link href="http://www.cybervaldez.com/category/jquery/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.cybervaldez.com</link>
	<description></description>
	<lastBuildDate>Wed, 26 Oct 2011 08:05:25 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>[Super Tip!] How to loop or iterate over an object&#8217;s key/value pair.</title>
		<link>http://www.cybervaldez.com/super-tip-how-to-loop-or-iterate-over-an-objects-keyvalue-pair/2011/</link>
		<comments>http://www.cybervaldez.com/super-tip-how-to-loop-or-iterate-over-an-objects-keyvalue-pair/2011/#comments</comments>
		<pubDate>Wed, 31 Aug 2011 13:57:56 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[How-tos]]></category>
		<category><![CDATA[Jquery]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Super Tip!]]></category>
		<category><![CDATA[Tips & Tricks]]></category>
		<category><![CDATA[Tutorials]]></category>

		<guid isPermaLink="false">http://www.cybervaldez.com/?p=1313</guid>
		<description><![CDATA[Problem: Help! Is it possible to loop or iterate through each object&#8217;s key/value pair like an array? Answer: A very useful trick for iterating over objects is the use of (for x in object), with this you can completely use objects as array! myObject = { &#8220;this&#8221; : &#8220;value1&#8243;, &#8220;is&#8221; : &#8220;value2&#8243;, &#8220;awesome&#8221; : &#8220;value3&#8243; [...]]]></description>
			<content:encoded><![CDATA[<p><strong>Problem</strong>: Help! Is it possible to loop or iterate through each object&#8217;s key/value pair like an array? 
<strong>Answer</strong>: A very useful trick for iterating over objects is the use of (<em><strong>for x in object</strong></em>), with this you can completely use objects as array!</p>

<blockquote><p>myObject = { <br />
    &#8220;this&#8221; : &#8220;value1&#8243;, <br />
    &#8220;is&#8221; : &#8220;value2&#8243;, <br />
    &#8220;awesome&#8221; : &#8220;value3&#8243; <br />
} <br />
</p>
<p>
for (x in myObject)<br />
    alert(&#8216;key : &#8216; + x + &#8216; / value : &#8216; + myObject[x]); <br />
</p>
</blockquote>
]]></content:encoded>
			<wfw:commentRss>http://www.cybervaldez.com/super-tip-how-to-loop-or-iterate-over-an-objects-keyvalue-pair/2011/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Jquery Super Tip! Automatically highlight the links/menu of the current page with 1 line of code</title>
		<link>http://www.cybervaldez.com/jquery-super-tip-automatically-highlight-the-linksmenu-of-the-current-page-with-1-line-of-code/2009/</link>
		<comments>http://www.cybervaldez.com/jquery-super-tip-automatically-highlight-the-linksmenu-of-the-current-page-with-1-line-of-code/2009/#comments</comments>
		<pubDate>Tue, 25 Aug 2009 17:33:59 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Jquery]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tips & Tricks]]></category>
		<category><![CDATA[active]]></category>
		<category><![CDATA[auto]]></category>
		<category><![CDATA[automatically]]></category>
		<category><![CDATA[cool]]></category>
		<category><![CDATA[easily]]></category>
		<category><![CDATA[easy]]></category>
		<category><![CDATA[highlight]]></category>
		<category><![CDATA[hover]]></category>
		<category><![CDATA[how]]></category>
		<category><![CDATA[links]]></category>
		<category><![CDATA[menu]]></category>
		<category><![CDATA[page]]></category>
		<category><![CDATA[state]]></category>
		<category><![CDATA[super]]></category>
		<category><![CDATA[technique]]></category>
		<category><![CDATA[tip]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://www.cybervaldez.com/?p=1130</guid>
		<description><![CDATA[One very important usability feature of a website is to have the menu or links highlight the current page the visitor is currently in. Here&#8217;s a trick I do with jquery to do just about that. For educational purposes, i&#8217;ve split it to 3 lines of code to make it more understandable. Simply add the [...]]]></description>
			<content:encoded><![CDATA[<p><!--adsensestart-->
One very important usability feature of a website is to have the menu or links highlight the current page the visitor is currently in. Here&#8217;s a trick I do with jquery to do just about that. For educational purposes, i&#8217;ve split it to 3 lines of code to make it more understandable.</p>

<p>Simply add the following to your header (don&#8217;t forget to include jquery first!).</p>

<blockquote>$(document).ready(function()
&nbsp;&nbsp;{
&nbsp;&nbsp;&nbsp;&nbsp;var loc = window.location.toString().split(&quot;/&quot;)
&nbsp;&nbsp;&nbsp;&nbsp;loc = loc[loc.length - 1]
&nbsp;&nbsp;&nbsp;&nbsp;$(&quot;#navigation li a[href=\&quot;&quot;+loc+&quot;\&quot;]&quot;).addClass(&quot;selected&quot;);
&nbsp;&nbsp;});</blockquote>

<p>Of course, jquery isn&#8217;t really needed to do this. If you prefer to have it done <strong>_without_</strong> jquery, here&#8217;s a native way of doing things:</p>

<blockquote>
&nbsp;&nbsp;  window.onload = function()
&nbsp;&nbsp;  {
&nbsp;&nbsp;&nbsp;&nbsp;    var current_page = window.location.toString().split(&quot;/&quot;)[window.location.toString().split(&quot;/&quot;).length - 1]   
&nbsp;&nbsp;&nbsp;&nbsp;    var links = document.getElementsByTagName(&quot;a&quot;);
&nbsp;&nbsp;&nbsp;&nbsp;    for (x in links)
&nbsp;&nbsp;&nbsp;&nbsp;    {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;      var link = (links[x].href != undefined) ? links[x].href.toString().split(&quot;/&quot;)[links[x].href.toString().split(&quot;/&quot;).length &#8211; 1] : &quot;&quot;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;      if (link == current_page)
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;        links[x].className = (links[x].className == &quot;&quot;) ? &quot;selected&quot; : links[x].className + &quot; selected&quot;
&nbsp;&nbsp;&nbsp;&nbsp;    }    
&nbsp;&nbsp;  }
</blockquote>

<p><strong>_Important_</strong>: The above code takes use of the <strong>.selected</strong> class. Simply add the class to your a:hover classes.</p>

<blockquote>#navigation ul li a:hover { color: #ff0; }</blockquote>

<p>Should be written as:</p>

<blockquote>#navigation ul li a:hover, #navigation ul li a.selected { color: #ff0 !important; }</blockquote>

<p><strong>_Don&#8217;t Forget!_</strong>, this works for menu/links with background images as well.</p>

<p>and that&#8217;s all there is to it! Don&#8217;t forget to thumb this up and share!
<a href="http://www.stumbleupon.com/submit?url=http://www.cybervaldez.com/jquery-super-tip-automatically-highlight-the-linksmenu-of-the-current-page-with-1-line-of-code/2009/%26title%3DAutomatically%2BHighlight%2BThe%2BCurrent%2BPage%2Bwith%2BJQuery"> <img border=0 src="http://cdn.stumble-upon.com/images/120x20_thumb_black.gif" alt=""></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.cybervaldez.com/jquery-super-tip-automatically-highlight-the-linksmenu-of-the-current-page-with-1-line-of-code/2009/feed/</wfw:commentRss>
		<slash:comments>25</slash:comments>
		</item>
		<item>
		<title>How to: Fix OCUpload/One-Click Upload clicking bug in IE7 &amp; IE8 (jquery)</title>
		<link>http://www.cybervaldez.com/how-to-fix-ocuploadone-click-upload-clicking-bug-in-ie7-ie8-jquery/2009/</link>
		<comments>http://www.cybervaldez.com/how-to-fix-ocuploadone-click-upload-clicking-bug-in-ie7-ie8-jquery/2009/#comments</comments>
		<pubDate>Tue, 18 Aug 2009 15:47:39 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Bug Fixes]]></category>
		<category><![CDATA[How-tos]]></category>
		<category><![CDATA[Jquery]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[click]]></category>
		<category><![CDATA[double]]></category>
		<category><![CDATA[explorer]]></category>
		<category><![CDATA[fix]]></category>
		<category><![CDATA[how]]></category>
		<category><![CDATA[how to]]></category>
		<category><![CDATA[ie6]]></category>
		<category><![CDATA[ie7]]></category>
		<category><![CDATA[ie8]]></category>
		<category><![CDATA[internet]]></category>
		<category><![CDATA[ocupload]]></category>
		<category><![CDATA[one]]></category>
		<category><![CDATA[plugin]]></category>
		<category><![CDATA[problem]]></category>
		<category><![CDATA[solution]]></category>
		<category><![CDATA[troubleshoot]]></category>
		<category><![CDATA[upload]]></category>

		<guid isPermaLink="false">http://www.cybervaldez.com/?p=1119</guid>
		<description><![CDATA[Problem: Help! I&#8217;m using the OCUpload, or One Click Upload Plugin for Jquery. IE7 and IE8 is requiring me to do a double click to display the upload dialog box! Solution: The one-click upload technique uses a trick that sets the file input&#8217;s browse button directly in front of your mouse cursor. This is misbehaving [...]]]></description>
			<content:encoded><![CDATA[<p><!--adsensestart--><strong>Problem</strong>: Help! I&#8217;m using the <a href="http://plugins.jquery.com/project/ocupload">OCUpload</a>, or <a href="http://plugins.jquery.com/project/ocupload">One Click Upload Plugin</a> for Jquery. IE7 and IE8 is requiring me to do a double click to display the upload dialog box!</p>

<p><strong>Solution</strong>: The one-click upload technique uses a trick that sets the file input&#8217;s browse button directly in front of your mouse cursor. This is misbehaving in IE7/IE8 due to how they handle CSS, this can be resolved by directly setting the cursor position through javascript instead. You can fix the problem by editting the script and updating the following lines (highlighted in bold):</p>

<p>Somewhere on line 87:</p>

<blockquote>
/** Move the input with the mouse to make sure it get clicked! */
container.mousemove(function(e){
&nbsp;&nbsp; input.css({
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; top: e.pageY-container.offset().top+&#8217;px&#8217;,
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <strong style="font-weight:bold;">left: e.pageX-container.offset().left-175+&#8217;px&#8217;</strong>
&nbsp;&nbsp; });
});</blockquote>

<p>Finally, we need to set the margin css property to 0, you can find it somewhere on line 63:</p>

<blockquote>
/** File Input */
var input = $(
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &#8216;&lt;input &#8216;+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &#8216;name=&#8221;&#8216;+options.name+&#8217;&#8221; &#8216;+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &#8216;type=&#8221;file&#8221; &#8216;+
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &#8216;hidefocus=&#8221;true&#8221; &#8216;+
&nbsp;&nbsp;&nbsp;&nbsp; &#8216;/&gt;&#8217;
).css({
&nbsp;&nbsp;&nbsp;&nbsp; background: &#8216;#ffffff&#8217;,
&nbsp;&nbsp;&nbsp;&nbsp; position: &#8216;relative&#8217;,
&nbsp;&nbsp;&nbsp;&nbsp; display: &#8216;block&#8217;,
&nbsp;&nbsp;&nbsp;&nbsp; <strong style="font-weight: bold;">marginLeft: 0+&#8217;px&#8217;,</strong>
&nbsp;&nbsp;&nbsp;&nbsp; opacity: 0
});</blockquote>

<p><a href="http://www.stumbleupon.com/submit?url=http://www.cybervaldez.com/how-to-fix-ocuploadone-click-upload-clicking-bug-in-ie7-ie8-jquery/2009/%26title%3DOCUpload%2BBug%2BFix"> <img border=0 src="http://cdn.stumble-upon.com/images/120x20_thumb_black.gif" alt=""></a></p>

<p>That&#8217;s it! Hope this helped!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.cybervaldez.com/how-to-fix-ocuploadone-click-upload-clicking-bug-in-ie7-ie8-jquery/2009/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

