jQuery get the event when bootstrap modal is open?

How to get the event when Bootstrap modal is open? Many times we need the event for changing some information on modal┬ábefore modal display. So let’s see, How to get the jQuery event before modal is open.

First of all, we create the simple bootstrap modal.

Continue reading jQuery get the event when bootstrap modal is open?

CSS Counter increment

How to create the counter increment using CSS like the bullet. CSS provides the counter functionality using that we can create the number before stating lists as per line like the bullet number.

Let’s create the HTML code for our counter.

<div class="lists">
<p>First Element</p>
<p>Second Element</p>
<p>Third Element</p>
<p>Four Element</p>
<p>Five Element</p>
<p>Six Element</p>
<p>Seven Element</p>
</div>

Let’s creat the counter code for our listing using CSS.


<style type="text/css">
.lists {
counter-reset: headings;
list-style: none;
}
.lists > p:before {
background: none repeat scroll 0 0 #8F8888;
border-radius: 15px;
color: #FFFFFF;
counter-increment: headings;
content: counter(headings, decimal);
display: block;
float: left;
font-size: 16px;
font-weight: bold;
height: 25px;
line-height: 26px;
margin-bottom: 0;
margin-right: 5px;
top : -5px;
position: relative;
text-indent: 8px;
width: 25px;
}
</style>

Using above code you can create the listing counter on any  HTML tag listing like above. The output look like below.

CSS Counter

If you have any issue or question write comment below.