JQuery remove !important

I have searched a lot. And i couldn't find solution how to remove the option. But i found that you can set another one attribute with jquery with important option, so you could overlap old style.

Here is code i have used for changing background-color of element - body which had background-color attribute with important option.

$("body").css("cssText","background-color: #FFF !important");

Count divs in div with jquery

Solution for: We have several elements ( tags ) for example divs, in div or other object which can contain elements inside it with certain class or ID, and we want to count how many there are the certain elements. For example we have several divs:

<div class="div1">
 <div></div>
 <div></div>
 <div></div>
 <div></div>
 <div></div>
</div>

JQuery counter for the divs inside the div is:

$(document).ready(function()
{ 
 var divs_count = $("#div1 > div").size();
 alert(divs_count);
}

Disabled input with JQuery

We have in html inputs like text, radio, select and textareas.

In my situation i had radio inputs and i needed to create trigger which should effect other inputs ( disable them ).

My inputs:

<input name="order_type" type="radio" value="2" /><br />
<input name="order_type" type="radio" value="3" /><br />
<input name="order_type" type="radio" value="4" />

Other section which i want to disable:

<input class="viewspereach" name="text" type="text" value="" />

JQuery:

$("input[name=order_type]").change(check_ordertype);
  
  function check_ordertype()
  {
    var order_type = $("input[name=order_type]:checked").attr("value");
    
    if(order_type == 4)
    { 
      $(".viewspereach").prop('disabled', true);

    }
    else
    {
      $(".viewspereach").prop('disabled', false);
    }
  }

Demo: http://igloro.info/demos/disableinput.php

Filter Select options JQuery

Filtering select options jusy by inputting text into text field - "textbox" or other input type. You can do that by using jquery.

Demo with full code is here:
http://www.igloro.info/demos/selectfilter.php

Source:
http://www.lessanvaezi.com/filter-select-list-options/

JQuery email check

To check if user typed his email right you can use jquery.

Atribute of reg:

var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;

And IF code:

if(!emailReg.test(email))
{
     error = true;
 }

Full code will could look like

$(document).ready(function()
{
  $("input.button[name=komentuoti]").click(function()
  {
    var email = $("input[name=email]").val();
    var error;
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
 
    if(!emailReg.test(comment_email))
    {
      error = true;
      return false;
    }
 
    if(error == true)
    {
      alert("Bad email!");
    }    
  }
});

Seo keywords optimization tools.

Currently working on my own new project. In the project im trying to create tool for monitoring seo keywords of other projects.

I have a lot fun and im trying to use most newest tools to create it. There already is some good tools, like keywords searching, google pagerank counter, urls counter, google analytics monitoring and much much more coming!

Hope to see some testers there and ill would like to hear some suggestions from your side if you are very interested in it.

It is a bit bugged for now but ill fix everything very soon.

Also it will be multi language project. But for beggining there will be only 2 languages - Lithuanian and English.

Source: http://www.igloro.info

Optimize your website

At work as programmer i need to optimize page load time.

So here is some tweaks which you can use for your own web sites.

1. Optimizing your CSS and JS ( Javascript, Jquery and so on... ).
All pages uses css and js. Most of time they are huge. like 50-500 kb for css and same for JS.

Most of time i use the tool to see how fast my page is loading:

http://tools.pingdom.com

Best way to optimize CSS is:
Explode CSS files by parts and use only required ones for pages you are using. After compress it with such tools as http://www.cssdrive.com/index.php/main/csscompressor. And in same time combine these ones together into one single load ( search google for CSS.php combiner ).


Best way to optimize JS is:
Explode by files and use only required code you are using. Compress these files with tools like this: http://www.compress-javascript.com/ ( Some codes don't work after compress, you can try to find another good compressor which will compress better than this one. Let me know if you find anything.. )
In same time combine them with combiners into one file. ( search google for JS.php combiner ).

2. Cache! Best way to optimize website is to use cache.
There also some good tweaks about cache. For example using GZIP cache.
Most of time gzip compressed code with 80% success. For example if you code is 100kb, gzip will compress into 20kb and load it into user browser.
To check gzip compression im using such tools as this one: http://www.whatsmyip.org/http_compression/

3. Images! Less images - better. But as you know, logos and so on.. are important for web sites.
Big web sites as facebook using very nice technique - one big image with all images: http://static.ak.fbcdn.net/rsrc.php/v1/zi/r/uVYVvAILt0K.png

4. HTML, PHP code optimization gives some results too. Spaces, tabs, else { } and so on are pretty good on lowering some kbs...
but each kb less will be some gigabytes less for server load per day-week-month if your web site is big!.

5. Javascript lazyloading - it is very nice tool for loading images. It will load image only if user sees the image. If the image is not in visible spot, it will not be loaded.
Source: http://www.appelsiini.net/projects/lazyload

And remember, that visitor is important of all web sites!

Broken image. Failed to load images fix with JQuery

Today i was solving problem with failed to load images. There was 2 solutions for this - 1) php with getimagesize and 2) JQuery check.

getimagesize showed me warnings so my choice was JQuery.

And it was great choice, because using jquery is always fun.

Code i used for all img ( CSS attribute ):

$(window).load(function() {
$('img').each(function() {
if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) {
// image was broken, replace with your new image
this.src = 'http://www.example.com/replace_no_image.jpg';
}
});
});