Wednesday, March 28, 2012

jQuery Validate Email Address

This is how to validate an email address.

html:
<form method="post">
<input type="text" id="email"/>
<input type="submit" val="submit" id="submit">
</form>

jQuery:
<script type="text/javascript">
jQuery('#submit').click(function() {
var hasError = false;
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
var emailaddressVal=jQuery('#email').val();
if(!emailReg.test(emailaddressVal)||emailaddressVal=='') {  
    alert('invalid');
    return false;
}
else{
    alert('valid');
    return false;
    }
});
</script>
Hope this will help!..

Sunday, March 25, 2012

disable contact number detection on ipad

Add this meta tag to disable the website's contact number detection in ipad.


<meta name = "format-detection" content = "telephone=no" />

Hope this will help!.

Monday, March 19, 2012

business catalyst blog post list with image

This is a code on how to get the image of your blog post description put it in the bloglist.

jQuery(".blog-post").each(function(){
 var thisUrl=window.location.href;
 var splitThisUrl=thisUrl.split(".com/");
 var uri=jQuery(this).find(".post-body a").attr("href");
 var imgUrl=splitThisUrl[0]+".com"+uri;
 jQuery(this).find(".imgCont").load(imgUrl+" .post-body img:eq(0)");
});


How to use:
In the Blog Post List Layout put a div that will serve as the container of the image. In this example I named it .imgCont.

Tuesday, March 6, 2012

ie css hack

In hacking ie css please use the following

/*------ IE6 ------ */
*html /*class or id*/{
  padding-left:10px;
}
/*------ IE7 ------ */ 
*+html /*class or id*/{
  padding-left:10px;
}
/*------ IE8 ------ */
/*class or id*/{
  padding-left:10px \0/;
}
/*------ IE9 ------ */ 
:root /*class or id*/{
margin-left:-20px;
}

Sunday, March 4, 2012

google plus one and add to circles button

 This is for adding a +1 button and counter in your blog post or page.
<!-- +1 button with counter -->
<g:plusone width="500" count="true" annotation="bubble"></g:plusone>

<!-- add to circle -->
For adding add to circle button just put this code.
<g:plus href="https://plus.google.com/{profile id}" rel="author" width="170" height="69" theme="dark"></g:plus>
<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

How to use:
Finding you profile ID:
https://plus.google.com/11443741220123456789/
Your profile ID are the numbers in your url if you will click profile.

Hope this will help!!


Thursday, March 1, 2012

jQuery shuffle plugin for banner rotator

This is a useful plug in in which allows you to shuffle the banner images if you wat to show it randomly.

(function($){
    $.fn.shuffle = function() {
        var allElems = this.get(),
            getRandom = function(max) {
                return Math.floor(Math.random() * max);
            },
            shuffled = $.map(allElems, function(){
                var random = getRandom(allElems.length),
                    randEl = $(allElems[random]).clone(true)[0];
                allElems.splice(random, 1);
                return randEl;
           });
        this.each(function(i){
            $(this).replaceWith($(shuffled[i]));
        });
        return $(shuffled);
    };
})(jQuery);

How to use:
<script>  
 $(document).ready(function() {
    /*put this on top or before your rotator*/
    $('.slideshow img').shuffle(); 
    $('.slideshow').cycle({
        fx: 'fade' 
    });
});
</script>