CODEWITHSUNDEEP
javascriptcssflipclock
Jerome Papalie
Jerome Papalie

Reputation: 49

Hide Seconds Counter on Flipclock.js

I'm currently working on a project where the requirement is to use flipclock.js to create an HH:MM counter.

I'm using the HourlyCounter clock face. Does anyone know how I could hide the seconds part?

Thanks in advance!

UPDATE

After using @Rahul's css, i've gotten the following:

enter image description here

UPDATE2

I've got an image of the inspected element if that helps:

enter image description here

Upvotes: 0

Views: 1756

Answers (2)

Amsvartner
Amsvartner

Reputation: 793

You can specify wether or not to show seconds via the options, when you initiate the clock. Like this:

<script type="text/javascript">
        var clock;

        $(document).ready(function() {
            clock = $('.clock').FlipClock({
                clockFace: 'TwentyFourHourClock',
                showSeconds: false
            });
        });
</script>

If you are unsure how to use it, there's an example file included in the package that you download on their website, "examples/twenty-four-hour-clock-without-seconds.html"

Upvotes: 1

Rahul
Rahul

Reputation: 4374

Note: Since you dont provide any code/demo Im taking reference from http://flipclockjs.com/

here you go...

you can use below code, this will hide seconds part

.flip-clock-divider.seconds , .flip-clock-divider.seconds ~ .flip.play {
    display: none;
}

enter image description here

then you may need to adjust width accordingly like

.header .clock{
  width: 300px;
}

Upvotes: 1

Related Questions