Posts

Showing posts with the label Css

How to Change Cursor on Hover in CSS

-
 <!DOCTYPE html> <html> <head> <style> .alias {cursor: alias;} .all-scroll {cursor: all-scroll;} .auto {cursor: auto;} .cell {cursor: cell;} .context-menu {cursor: context-menu;} .col-resize {cursor: col-resize;} .copy {cursor: copy;} .crosshair {cursor: crosshair;} .default {cursor: default;} .e-resize {cursor: e-resize;} .ew-resize {cursor: ew-resize;} .grab {cursor: -webkit-grab; cursor: grab;} .grabbing {cursor: -webkit-grabbing; cursor: grabbing;} .help {cursor: help;} .move {cursor: move;} .n-resize {cursor: n-resize;} .ne-resize {cursor: ne-resize;} .nesw-resize {cursor: nesw-resize;} .ns-resize {cursor: ns-resize;} .nw-resize {cursor: nw-resize;} .nwse-resize {cursor: nwse-resize;} .no-drop {cursor: no-drop;} .none {cursor: none;} .not-allowed {cursor: not-allowed;} .pointer {cursor: pointer;} .progress {cursor: progress;} .row-resize {cursor: row-resize;} .s-resize {cursor: s-resize;} .se-resize {cursor: se-resize;} .sw-resize {cursor: sw-resize;} .text
Post a Comment
Read more

how to add page load animation

-
first add jquery.min.js cdn in head after add style on head file <style type="text/css">   .loader {     position: fixed;     left: 0px;     top: 0px;     width: 100%;     height: 100%;     z-index: 9999;     background: url('assent/dist/img/loading.gif') 50% 50% no-repeat rgb(249,249,249);     opacity: .8; } </style> after add javascript before body tag: <script>$(window).on('load', function(){      $(".loader").fadeOut("slow"); });</script> after add this code after body tag:   <div class="loader"></div>
Post a Comment
Read more

Codeigniter Fullcalendar Example

-
A fullcalendar is a open source jquery library and that provide to create event in calendar and you can easily customize library event. fullcalendar also provide drag and drop event calendar with responsive. In this example, we will create "events" table with title, start_date and end_date. We will store data manually on that table and then display all events form database dynamically. So you have to just follow few step and get layout like as bellow screen shot. Step 1: Create events Table In first table we must have one table with some dummy records. For this example i will create "events" table and dummy records as like bellow query: events table CREATE TABLE IF NOT EXISTS `events` ( `id` int(11) NOT NULL AUTO_INCREMENT, `title` varchar(255) NOT NULL, `start_date` date NOT NULL, `end_date` date NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ; Step 2: Make database configurat
Post a Comment
Read more

live sum using javascript

-
<script type="text/javascript"> $(document).ready(function() {     //this calculates values automatically     sum();     $("#num1, #num2").on("keydown keyup", function() {         sum();     }); }); function sum() {             var num1 = document.getElementById('num1').value;             var num2 = document.getElementById('num2').value; var result = parseInt(num1) + parseInt(num2); var result1 = parseInt(num2) - parseInt(num1);             if (!isNaN(result)) {                 document.getElementById('sum').value = result; document.getElementById('subt').value = result1;             }         } </script> <form name="form1" method="post" action="" > <table> <tr><td>Num 1:</td><td><input type="text" name="num1" id="num1" /></td></tr> &
Post a Comment
Read more

add more button new row using javascript

-
<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"> <!-- jQuery library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <!-- Latest compiled JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script> <script>$(document).ready(function () { var counter = 0; $("#addrow").on("click", function () { var newRow = $("<tr>"); var cols = ""; cols += '<td><input type="text" class="form-control" name="name' + counter + '"/></td>'; cols += '<td><input type="text" class="form-control"
Post a Comment
Read more

OOPS Concepts in PHP?

-
Class  − This is a programmer-defined data type, which includes local functions as well as local data. You can think of a class as a template for making many instances of the same kind (or class) of object. Object  − An individual instance of the data structure defined by a class. You define a class once and then make many objects that belong to it. Objects are also known as instance. Member Variable  − These are the variables defined inside a class. This data will be invisible to the outside of the class and can be accessed via member functions. These variables are called attribute of the object once an object is created. Member function  − These are the function defined inside a class and are used to access object data. Inheritance  − When a class is defined by inheriting existing function of a parent class then it is called inheritance. Here child class will inherit all or few member functions and variables of a parent class. Parent class  − A class that is inherited from b
Post a Comment
Read more

Google places autocomplete dropdown

-
The Google Places API Web Service enforces a default limit of 1 000 requests per 24 hour period, which you can increase free of charge. If your app exceeds the limit, the app will start failing. Verify your identity to get up to 150 000 requests per 24 hour period <!DOCTYPE html> <html>     <head>         <title>Place Autocomplete</title>         <meta name="viewport" content="initial-scale=1.0, user-scalable=no">         <meta charset="utf-8">         <script src="http://code.jquery.com/jquery-latest.min.js"></script>         <script>             $(document).ready(function() {                 $('input.deletable').wrap('<span class="deleteicon" />').after($('<span/>').click(function() {                     $(this).prev('input').val('').trigger('change').focus();                 }));             });         </scr
Post a Comment
Read more