Event 101


In this lesson we learn some important method is use in Events. When we use some click methods than an event occur. So let see some different methods use in Events. In below examples we are going to set two kind of theme for our web page, first is day mode, second is night mode. First we create two css files. 1 is day.css for setting up day theme where we set a sunny yellow background, than 2 is for night mode where we set a black background. We set day.css as default style sheet for web page. Let create some code for this theme.

Step 1

day.css = body{ background: yellow ;} // Default stylesheet
Night.css = body{ background: black; }

Step 2

Create two buttons and set value for one is day and second for Night.

Step 3

Give jQuery reference than start writing code into script tag.

Way 1

Image

In above example first we create a black function for save our code from third party, than create a click event for button than create a var called button by indicating $(this) method. after than we create a stylesheet variable where we put values button text in lower case(Day or Night in lowercase), Than use jQuery for select link and modify their attribute with stylesheet name match with small or lower case and than joint it with .css extension.

Way 2 : Data-file method

Image

By using this method we set data-file into buttons for accessing them by it.

We also can use data file method as :

Image

Way 3 : Sibling method using removeAttr and disabled click event

Image

Setting up Way 3 again :

Image

Giving final touch to Way 3 : By using .end() method

Image

in above example we use .end(), this method is use for stop functionality of particular element where we using it and than start next functionality from where we stop the function start new session form last stop point or level.


Wconcert India © 2015   ·   All Rights Reserved

Free Web Hosting