CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Vikas hatwal
Vikas hatwal

Reputation: 35

Circle timer background color change

I am using a timer. I want to put a black background at the back of text in the circle shape. right now it is transparent and you can see blue color at the back of text. I want that blue to black in the center part of the circle only.

$("#DateCountdown").TimeCircles();
$("#CountDownTimer").TimeCircles({
    time: {
        Days: {
            show: false
        },
        Hours: {
            show: false
        }
    }
});
$("#PageOpenTimer").TimeCircles();
var updateTime = function () {
    var date = $("#date").val();
    var time = $("#time").val();
    var datetime = date + ' ' + time + ':00';
    j$("#DateCountdown").data('date', datetime).TimeCircles().start();
}
$("#date").change(updateTime).keyup(updateTime);
$("#time").change(updateTime).keyup(updateTime);
$(".startTimer").click(function () {
    $("#CountDownTimer").TimeCircles().start();
});
$(".stopTimer").click(function () {
    $("#CountDownTimer").TimeCircles().stop();
});
$(".fadeIn").click(function () {
    $("#PageOpenTimer").fadeIn();
});
$(".fadeOut").click(function () {
    $("#PageOpenTimer").fadeOut();
});

Fiddle

Upvotes: 1

Views: 823

Answers (1)

Jeff Watkins
Jeff Watkins

Reputation: 6359

The plugin didn't support it... So what I did was change the plugin.

I added:

    use_inner_background: true,
    circle_inner_bg_color: "#000",

to the standard settings, you can change these as you will to make it transparent or not. I defaulted it to black.

See the working fiddle, here

Upvotes: 3

Related Questions