// JavaScript Document
var navSelectedStates = function() {
var currentURL = window.location.href;
if (currentURL.match('/setting/admin')) {
$('ul.tabs li:nth-child(3)').addClass('selected');
}
else if (currentURL.match('/setting/register_user')) {
$('ul.main_blog_subnav li:nth-child(5)').addClass('selected');
}
}();
In addition to the .css() function, you can apply currently defined CSS classes by using the .addClass() function. Its counterpart function, .removeClass(), reverses the action.
$('img').addClass('imgbox');
The .toggleClass() function is a huge time-saver for toggling a state on and off with CSS. I normally use this to set event handlers for mouseenter (which applies the CSS classimg-hover to the image) and mouseleave (which removes it).
$('.imgbox').on('mouseenter', function (e) {
$(this).toggleClass('imgopacity');
});
You can change your website’s styles dynamically with jQuery’s .css() & attr() function. Either change styles that are already declared inline or in CSS files (such as font-size, color,background-color, etc.) or create new styles for elements.
$('div#' + id).css({
'color': 'Blue',
'background-color': 'orange'
});$('img').attr({
'title': 'User image',
'alt': 'User image'
});
Now we will see how to push the ul element to inside a particular div and add some divs before and after.
Using jquery before() after() you can add elements to the DOM.
But there is a problem in that
Be aware that you are manipulating the DOM with before() & after() functions, not just simply concatenating some strings containing HTML. You cannot append .
You should use wrap() to add that div around your lists, and then use before() and after() to insert other divs.
$(“form”).submit(function (event) {
var text_val = $(‘#emailid’).val();
console.log(text_val);
var regex = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
if (!regex.test(j.trim(text_val))) {
$(‘.errormsg_box’).show();
return false;
} else {
$(‘.errormsg_box’).hide();
}
});
I got a book from my friend (Smashing Book), The Smashing Book is for professional Web designers and developers, with a focus on useful techniques and best practices. To illustrate this they gave some example websites.I visited one of the website.And saw that text-labels were placed inside text-boxes.When i clicked a text-box, the text-label for that text-box moved to the left the text-box. If i didn’t enter any text in a text-box then the text-label came back inside the text-box.
I started thinking that the site was done in flash because of these effects. When i inspected the page i was surprised because there was only HTML.
I asked Arvind Sridharan (my friend & colleague at Rang De). How these effects work without flash. He told me that they used jquery and that we can have these kind of effects on our website also. This is first time i heard about jquery. In my mind i had lot of questions ’what is jQuery’ , ‘Is it a progarmming language’ , ‘How can i use that in my Html page’ . Then i Googled it and i got lots of results. One of the result was a blog in which the writer said “jQuery is a Poor Man’s Flash”. At that time i couldn’t believe this now i am saying from bottom of heart that is 200% True.
