June 2013

Canonical Issue

<Ifmodule mod_rewrite.c>
Options +FollowSymlinks
RewriteEngine on
RewriteBase /
### re-direct index.html to root / ###
RewriteCond %{THE_REQUEST} ^.*\/index\.html\ HTTP/
RewriteRule ^(.*)index\.html$ /$1 [R=301,L]

### re-direct index.htm to root / ###
RewriteCond %{THE_REQUEST} ^.*\/index\.htm\ HTTP/
RewriteRule ^(.*)index\.htm$ /$1 [R=301,L]

### re-direct index.php to root / ###
RewriteCond %{THE_REQUEST} ^.*\/index\.php\ HTTP/
RewriteRule ^(.*)index\.php$ /$1 [R=301,L]

### re-direct default.html to root / ###
RewriteCond %{THE_REQUEST} ^.*\/default\.html\ HTTP/
RewriteRule ^(.*)default\.html$ /$1 [R=301,L]

### re-direct home.html to root / ###
RewriteCond %{THE_REQUEST} ^.*\/home\.html\ HTTP/
RewriteRule ^(.*)home\.html$ /$1 [R=301,L]

### re-direct IP address to www

### re-direct non-www to www

### re-direct any parked domain to www of main domain
RewriteCond %{http_host} !^www.example.com$ [nc]
RewriteRule ^(.*)$ http://www.example.com/$1 [r=301,nc,L]
####
### re-direct home to root / ###
Redirect /home http://www.all4cycling.com.au/
###To redirect all users to access the site WITH the ‘www.’ prefix,
### (http://example.com/… will be redirected to http://www.example.com/…)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !(.*)/$
RewriteRule ^(.*)$ http://www.example.com/$1/ [L,R=301]

</Ifmodule>

Download here: canonical-isue

June 27, 2013 0

Get Browser Version

//——————————– Check the browser version

jQuery(document).ready(function(){

var is_firefox = navigator.userAgent.indexOf(‘Firefox’) > -1;

var is_chrome = navigator.userAgent.indexOf(‘Chrome’) > -1;

var is_explorer = navigator.userAgent.indexOf(‘MSIE’) > -1;

var is_safari = navigator.userAgent.indexOf(“Safari”) > -1;

if(is_firefox){

getFirefoxVersion();

}

if(is_chrome){

getChromeVersion();

}

if(is_explorer){

getIEVersion();

}

if(is_safari){

getSafariVersion();

}

});

function getFirefoxVersion(){

if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Firefox/x.x or Firefox x.x (ignoring remaining digits);

var ffversion=new Number(RegExp.$1) // capture x.x portion and store as a number

//alert(ffversion);

if (ffversion<20){

var $link = ‘<a href=”http://www.mozilla.com” target=”_blank”>http://www.mozilla.com</a>’;

message_popup(“It appears that you are using an outdated version of your browser. We suggest that you update to the latest version for better experience. Please click the link mentioned below to upgarde:<br/> “+$link);

}

function getSafariVersion(){

var userAgent = navigator.userAgent.toLowerCase();

jQuery.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());

// Is this a version of Chrome?

if(jQuery.browser.chrome){

userAgent = userAgent.substring(userAgent.indexOf(‘chrome/’) +7);

userAgent = userAgent.substring(0,userAgent.indexOf(‘.’));

// If it is chrome then jQuery thinks it’s safari so we have to tell it it isn’t

if (userAgent<26){

var $link = ‘<a href=”https://www.google.com/chrome/”>https://www.google.com/chrome/</a>’;

}

jQuery.browser.safari = false;

}

// Is this a version of Safari?

if(jQuery.browser.safari){

userAgent = userAgent.substring(userAgent.indexOf(‘version/’) +8);

userAgent = userAgent.substring(0,userAgent.indexOf(‘.’));

if (userAgent<6){

var $link = ‘<a href=”http://www.apple.com/safari/”>http://www.apple.com/safari/</a>’;

}

function getChromeVersion(){

var userAgent = navigator.userAgent.toLowerCase();

jQuery.browser.chrome = /chrome/.test(navigator.userAgent.toLowerCase());

if(jQuery.browser.chrome){

userAgent = userAgent.substring(userAgent.indexOf(‘chrome/’) +7);

userAgent = userAgent.substring(0,userAgent.indexOf(‘.’));

//alert(userAgent);

if (userAgent<26){

var $link = ‘<a href=”https://www.google.com/chrome/” target=”_blank”>https://www.google.com/chrome/</a>’;

}

function getIEVersion(){ alert(‘getIEVersion’);

var rv = parseFloat(navigator.appVersion.split(“MSIE”)[1]);

alert(rv);

if (rv<10){

var $link = ‘<a href=”http://windows.microsoft.com/ie” target=”_blank”>http://windows.microsoft.com/ie</a>’;

}

</script>

Download here : browser-version

June 17, 2013 0

jQuery Selectors

Selector	Example	Selects
*	$(“*”)	All elements
#id	$(“#lastname”)	The element with id=”lastname”
.class	$(“.intro”)	All elements with class=”intro”
.class,.class	$(“.intro,.demo”)	All elements with the class “intro” or “demo”
element	$(“p”)	All <p> elements
el1,el2,el3	$(“h1,div,p”)	All <h1>, <div> and <p> elements

:first	$(“p:first”)	The first <p> element
:last	$(“p:last”)	The last <p> element
:even	$(“tr:even”)	All even <tr> elements
:odd	$(“tr:odd”)	All odd <tr> elements

:first-child	$(“p:first-child”)	All <p> elements that are the first child of their parent
:first-of-type	$(“p:first-of-type”)	All <p> elements that are the first <p> element of their parent
:last-child	$(“p:last-child”)	All <p> elements that are the last child of their parent
:last-of-type	$(“p:last-of-type”)	All <p> elements that are the last <p> element of their parent
:nth-child(n)	$(“p:nth-child(2)”)	All <p> elements that are the 2nd child of their parent
:nth-last-child(n)	$(“p:nth-last-child(2)”)	All <p> elements that are the 2nd child of their parent, counting from the last child
:nth-of-type(n)	$(“p:nth-of-type(2)”)	All <p> elements that are the 2nd <p> element of their parent
:nth-last-of-type(n)	$(“p:nth-last-of-type(2)”)	All <p> elements that are the 2nd <p> element of their parent, counting from the last child
:only-child	$(“p:only-child”)	All <p> elements that are the only child of their parent
:only-of-type	$(“p:only-of-type”)	All <p> elements that are the only child, of its type, of their parent

parent > child	$(“div > p”)	All <p> elements that are a direct child of a <div> element
parent descendant	$(“div p”)	All <p> elements that are descendants of a <div> element
element + next	$(“div + p”)	The <p> element that are next to each <div> elements
element ~ siblings	$(“div ~ p”)	All <p> elements that are siblings of a <div> element

:eq(index)	$(“ul li:eq(3)”)	The fourth element in a list (index starts at 0)
:gt(no)	$(“ul li:gt(3)”)	List elements with an index greater than 3
:lt(no)	$(“ul li:lt(3)”)	List elements with an index less than 3
:not(selector)	$(“input:not(:empty)”)	All input elements that are not empty

:header	$(“:header”)	All header elements <h1>, <h2> …
:animated	$(“:animated”)	All animated elements
:focus	$(“:focus”)	The element that currently has focus
:contains(text)	$(“:contains(‘Hello’)”)	All elements which contains the text “Hello”
:has(selector)	$(“div:has(p)”)	All <div> elements that have a <p> element
:empty	$(“:empty”)	All elements that are empty
:parent	$(“:parent”)	All elements that are a parent of another element
:hidden	$(“p:hidden”)	All hidden <p> elements
:visible	$(“table:visible”)	All visible tables
:root	$(“:root”)	The document’s root element
:lang(language)	$(“p:lang(de)”)	All <p> elements with a lang attribute value starting with “de”

[attribute]	$(“[href]”)	All elements with a href attribute
[attribute=value]	$(“[href=’default.htm’]”)	All elements with a href attribute value equal to “default.htm”
[attribute!=value]	$(“[href!=’default.htm’]”)	All elements with a href attribute value not equal to “default.htm”
[attribute$=value]	$(“[href$=’.jpg’]”)	All elements with a href attribute value ending with “.jpg”
[attribute\|=value]	$(“[hreflang\|=’en’]”)	All elements with a hreflang attribute value starting with “en”
[attribute^=value]	$(“[name^=’hello’]”)	All elements with a name attribute value starting with “hello”
[attribute~=value]	$(“[name~=’hello’]”)	All elements with a name attribute value containing the word “hello”
[attribute=value*]	$(“[name*=’hello’]”)	All elements with a name attribute value containing the string “hello”

:input	$(“:input”)	All input elements
:text	$(“:text”)	All input elements with type=”text”
:password	$(“:password”)	All input elements with type=”password”
:radio	$(“:radio”)	All input elements with type=”radio”
:checkbox	$(“:checkbox”)	All input elements with type=”checkbox”
:submit	$(“:submit”)	All input elements with type=”submit”
:reset	$(“:reset”)	All input elements with type=”reset”
:button	$(“:button”)	All input elements with type=”button”
:image	$(“:image”)	All input elements with type=”image”
:file	$(“:file”)	All input elements with type=”file”
:enabled	$(“:enabled”)	All enabled input elements
:disabled	$(“:disabled”)	All disabled input elements
:selected	$(“:selected”)	All selected input elements
:checked	$(“:checked”)	All checked input elements

jQuery Event Methods

Event methods trigger or attach a function to an event handler for the selected elements.

The following table lists all the jQuery methods used to handle events.

Method	Description
bind()	Attaches event handlers to elements
blur()	Attaches/Triggers the blur event
change()	Attaches/Triggers the change event
click()	Attaches/Triggers the click event
dblclick()	Attaches/Triggers the double click event
delegate()	Attaches a handler to current, or future, specified child elements of the matching elements
die()	Removed in version 1.9. Removes all event handlers added with the live() method
error()	Deprecated in version 1.8. Attaches/Triggers the error event
event.currentTarget	The current DOM element within the event bubbling phase
event.data	Contains the optional data passed to an event method when the current executing handler is bound
event.delegateTarget	Returns the element where the currently-called jQuery event handler was attached
event.isDefaultPrevented()	Returns whether event.preventDefault() was called for the event object
event.isImmediatePropagationStopped()	Returns whether event.stopImmediatePropagation() was called for the event object
event.isPropagationStopped()	Returns whether event.stopPropagation() was called for the event object
event.namespace	Returns the namespace specified when the event was triggered
event.pageX	Returns the mouse position relative to the left edge of the document
event.pageY	Returns the mouse position relative to the top edge of the document
event.preventDefault()	Prevents the default action of the event
event.relatedTarget	Returns which element being entered or exited on mouse movement.
event.result	Contains the last/previous value returned by an event handler triggered by the specified event
event.stopImmediatePropagation()	Prevents other event handlers from being called
event.stopPropagation()	Prevents the event from bubbling up the DOM tree, preventing any parent handlers from being notified of the event
event.target	Returns which DOM element triggered the event
event.timeStamp	Returns the number of milliseconds since January 1, 1970, when the event is triggered
event.type	Returns which event type was triggered
event.which	Returns which keyboard key or mouse button was pressed for the event
focus()	Attaches/Triggers the focus event
focusin()	Attaches an event handler to the focusin event
focusout()	Attaches an event handler to the focusout event
hover()	Attaches two event handlers to the hover event
keydown()	Attaches/Triggers the keydown event
keypress()	Attaches/Triggers the keypress event
keyup()	Attaches/Triggers the keyup event
live()	Removed in version 1.9. Adds one or more event handlers to current, or future, selected elements
load()	Deprecated in version 1.8. Attaches an event handler to the load event
mousedown()	Attaches/Triggers the mousedown event
mouseenter()	Attaches/Triggers the mouseenter event
mouseleave()	Attaches/Triggers the mouseleave event
mousemove()	Attaches/Triggers the mousemove event
mouseout()	Attaches/Triggers the mouseout event
mouseover()	Attaches/Triggers the mouseover event
mouseup()	Attaches/Triggers the mouseup event
off()	Removes event handlers attached with the on() method
on()	Attaches event handlers to elements
one()	Adds one or more event handlers to selected elements. This handler can only be triggered once per element
$.proxy()	Takes an existing function and returns a new one with a particular context
ready()	Specifies a function to execute when the DOM is fully loaded
resize()	Attaches/Triggers the resize event
scroll()	Attaches/Triggers the scroll event
select()	Attaches/Triggers the select event
submit()	Attaches/Triggers the submit event
toggle()	Removed in version 1.9. Attaches two or more functions to toggle between for the click event
trigger()	Triggers all events bound to the selected elements
triggerHandler()	Triggers all functions bound to a specified event for the selected elements
unbind()	Removes an added event handler from selected elements
undelegate()	Removes an event handler to selected elements, now or in the future
unload()	Deprecated in version 1.8. Attaches an event handler to the unload event

Plugin Structure

//You need an anonymous function to wrap around your function to avoid conflict
(function($){
//Attach this new method to jQuery
$.fn.extend({
//This is where you write your plugin’s name
pluginname: function() {
//Set the default values, use comma to separate the settings, example:
var defaults = {
padding: 20,
mouseOverColor : ‘#000000’,
mouseOutColor : ‘#ffffff’
}
var options = $.extend(defaults, options);
//Iterate over the current set of matched elements
return this.each(function() {
var o = options;
//code to be inserted here
//you can access the value like this
alert(o.padding);
});
}
});
//pass jQuery to the function,
//So that we will able to use any valid Javascript variable name
//to replace “$” SIGN. But, we’ll stick to $ (I like dollar sign: ) )
})(jQuery);

jQuery Traversing Methods

Method	Description
add()	Add elements to the set of matched elements
addBack()	Add the previous set of elements to the current set
andSelf()	Deprecated in version 1.8. An alias for addBack()
children()	Get the children of each element in the set of matched elements
closest()	For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors
contents()	Get the children of each element in the set of matched elements (including text and comment nodes)
each()	Execute a function for each matched element
end()	End the most recent filtering operation in the current chain, and return the set of matched elements to its previous state
eq()	Reduce the set of matched elements to the one at the specified index
filter()	Reduce the set of matched elements to those that match the selector or pass the function’s test
find()	Get the descendants of each element in the set of matched elements
first()	Reduce the set of matched elements to the first in the set
has()	Reduce the set of matched elements to those that have a descendant that matches the selector/DOM element
is()	Check the set of matched elements against a selector/element/jQuery object, and return true if at least one of these elements matches the given arguments
last()	Reduce the set of matched elements to the final one in the set
map()	Pass each element in the matched set through a function, producing a new jQuery object containing the return values
next()	Get the immediately following sibling of each element in the set of matched elements. If a selector is provided, it retrieves the next sibling only if it matches that selector
nextAll()	Get all following siblings of each element in the set of matched elements
nextUntil()	Get all following siblings of each element up to but not including the element matched by the selector/DOM node/jQuery object passed
not()	Remove elements from the set of matched elements
offsetParent()	Returns the first positioned parent element
parent()	Get the parent of each element in the set of matched elements
parents()	Get the ancestors of each element in the set of matched elements
parentsUntil()	Get the ancestors of each element in the set of matched elements, up to but not including the element matched by the selector/DOM node/jQuery object
prev()	Get the immediately preceding sibling of each element in the set of matched elements
prevAll()	Get all preceding siblings of each element in the set of matched elements
prevUntil()	Get all preceding siblings of each element up to but not including the element matched by the selector/DOM node/jQuery object
siblings()	Get the siblings of each element in the set of matched elements
slice()	Reduce the set of matched elements to a subset specified by a range of indices

June 17, 2013 0

jQuery toggle

Simple jQuery toggle

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<head>

<title>Untitled Document</title>

jQuery(document).ready(function() {

jQuery(“.content”).hide();

jQuery(“.heading”).click(function(){

jQuery(“.content”).slideUp();

jQuery(this).next(“.content”).slideToggle();

});

</script>

</head>

<body>

<style>

.layer1 {

margin: 0;

padding: 0;

width: 500px;

}

.heading {

margin: 1px;

color: #fff;

padding: 3px 10px;

cursor: pointer;

position: relative;

background-color:#c30;

}

.content {

padding: 5px 10px;

background-color:#fafafa;

}

p { padding: 5px 0; }

</style>

<div>

<p class=”heading”>Header-1 </p>

<div class=”content”>Lorem ipsum dolor sit amet, consectetuer adipiscing elit orem ipsum dolor sit amet, consectetuer adipiscing elit</div>

<p class=”heading”>Header-2</p>

<div class=”content”>Lorem ipsum dolor sit amet, consectetuer adipiscing elit orem ipsum dolor sit amet, consectetuer adipiscing elit</div>

<p class=”heading”>Header-3</p>

<div class=”content”>Lorem ipsum dolor sit amet, consectetuer adipiscing elit orem ipsum dolor sit amet, consectetuer adipiscing elit</div>

</div>

</body>

</html>

Download Code : jQuery-toggle

June 17, 2013 0

Magento Create Custom Module

Customise code according to you

Download doc here: magento-create-custom-module

June 15, 2013 0

Alves Singh

Month

Canonical Issue

Get Browser Version

jQuery Selectors

jQuery toggle

Magento Create Custom Module

Categories

Drupal

Interview

PHP

Wordpress

Recent Posts