Search code examples
buttonnumbersclickable

CSS and PHP: Make a clickable button influence a number


i've a clickable heart icon and i've a number at his right. I want the number to change everytime i click the heart. Do you know how can i achieve that? i'm messing around with PHP and CSS. The codes are these ones:

<span class="like-post" title="Like">
            <span class="icon"> </span>
            <span class="number"> 0 </span>
        </span> 

and the style.css

.like-post {
font-size: 11px;
font-weight: bold;
color: #555;
display: inline-block;
cursor: pointer;
width: 28px;
height: 15px;
margin-left:3px;
}

.icon  {
display: block;
width: 15px;
height: 15px;
position:relative;
top: 3px;
left:1px;
background: url('images/heart15.png');
}

.number  {
display: BLOCK;
float: right;
position: relative;
top: -14px;
 }

thanks!


Solution

  • You could write some jQuery to send an AJAX request to your PHP script on a .click() event and use .text() to change the number with the result from AJAX.