› Forums › CoolClock Pro › Can I make the clock bigger, and reposition in in a page?
- This topic has 3 replies, 2 voices, and was last updated 1 year, 5 months ago by RavanH.
- AuthorPosts
- 9 April 2023 at 11:43 #40473Steve BannisterParticipant
I would like to make the clock bigger, or the clock hands longer, than I am allowed by the maximum 100% to the size of the container. I need the minute and second hands to be the same length as the radius of my clock face and the hour hand to be just short of the markers. From a rough calculation, this would be 2.5 x their current length.
Also, I need to align to the exact centre of my clockface, which is a background image. I have it as close as I can get, but it doesn’t allow me any more changes.
Is this possible?
You can see my clock here http://clock.retrotelevision.co.uk/
Thank you.
- 26 May 2023 at 23:29 #40945RavanHKeymaster
Hi Steve, first: My appologies for this late reply. Somehow the messaging system seems to have failed and you did not get the help you needed at that moment.
Looking at your sample page, I see you have tried another clock solution in the meantime.
To answer your questions as much as possible:
The clock hands cannot be larger than 100% of the clock radius. To make the minute and second hands go past the minute/hour markers, you will need to move the hour markers inward instead.
Take a look at the clock named “Mister” at the end of https://premium.status301.com/knowledge-base/coolclock/skins/ for example. There, the second hand is further out than the hour markers. Or the clock “Machine”, fifth from the top, where the minute hand is further outside.
A custom skin with these parameters might be close to what you are looking for:
- 26 May 2023 at 23:31 #40946RavanHKeymaster
{ "largeIndicator": { "lineWidth": 10, "startAt": 80, "endAt": 100, "color": "white" }, "hourHand": { "lineWidth": 10, "startAt": 0, "endAt": 75, "color": "white" }, "minuteHand": { "lineWidth": 5, "startAt": 0, "endAt": 85, "color": "white" }, "secondHand":{ "lineWidth": 2, "startAt": 0, "endAt": 90, "color": "white" }, "secondDecoration": { "lineWidth": 0, "startAt": 0, "radius": 10, "color": "white", "fillColor": "white" } }
- 27 May 2023 at 00:54 #40992RavanHKeymaster
Or with black background added to cover the red brown orange bands:
[coolclock skin="retro" radius="200"] { "outerBorder": { "lineWidth": 100, "radius": 50, "color": "black", "alpha": 1 }, "largeIndicator": { "lineWidth": 10, "startAt": 75, "endAt": 95, "color": "white" }, "hourHand": { "lineWidth": 10, "startAt": 0, "endAt": 70, "color": "white" }, "minuteHand": { "lineWidth": 5, "startAt": 0, "endAt": 80, "color": "white" }, "secondHand": { "lineWidth": 2, "startAt": 0, "endAt": 85, "color": "white" }, "secondDecoration": { "lineWidth": 4, "startAt": 0, "radius": 8, "color": "white", "fillColor": "white" } } [/coolclock]
- AuthorPosts
- You must be logged in to reply to this topic.