CODEWITHSUNDEEP
javascriptcursorgoogle-plus-one
Constantino
Constantino

Reputation: 31

How to change cursor style when hovering the Google Plus One button

I want to change the cursor style when user hovers the Google "+1" button. I tried to use the div tag and add the style attribute, but it's not working.

<div class="g-plusone" data-size="tall" style="cursor:wait" ></div>
<script type="text/javascript">
 (function() {
var po = document.createElement('script'); 
po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; 
s.parentNode.insertBefore(po, s);
})();
</script>

I guess we need to add something to their js code.

Upvotes: 0

Views: 570

Answers (1)

amiry jd
amiry jd

Reputation: 27585

+1 is a button with these classes: class="esw eswd", and when hovered, these: class="esw eswd eswh". you can get this element with jQuery and control it: for example:

// with jQuery:
$("button.esw.eswd").each(function(){
    $(this).hover(function(){
        // your mouseover code here:
        $(this).addClass("some-class");
    },function(){
        // your mouseout code here:
        $(this).removeClass("some-class");
    });
});

///////////////
// or with css:

button.esw.eswd{
    // mouseout style here
}
button.esw.eswd.eswh{
    // mouseover style here
    cursor:wait;
}

Upvotes: 2

Related Questions