clangstaff Posted November 7, 2016 Share Posted November 7, 2016 I'm trying to create a sticky banner for our public website that will include the current date and current timetable week. So far I've pulled together the code below however, I'm having some issues with the date format and cannot get this to change. Ideally the format would be 'Mon 7th November'. <style> .banner-box { margin: 0; padding:10px; position: fixed; bottom: 100px; right: 0; width: 150px; height: auto; z-index: 100; display: none; text-decoration: none; color: #ffffff; background-color: #1d2129; font-size:16px; text-align:center; } </style> <div class="banner-box" style="display: inline;"> <p id="date"></p> <script> document.getElementById("date").innerHTML = Date() ; </script> <p><b>Week 1</b><br/></p> </div> Link to comment Share on other sites More sharing options...
clangstaff Posted November 9, 2016 Author Share Posted November 9, 2016 @Graham Quince Any ideas for this Graham Link to comment Share on other sites More sharing options...
Graham Quince Posted November 9, 2016 Share Posted November 9, 2016 Hi @clangstaff sorry, I've not had a chance to look at this properly. FrogLearn uses moment.js which is a more efficient timing script for Javascript (apparently). You can format text in different ways usign that http://momentjs.com/ If you want to stick with Javascript, then W3C Schools has a list of date formatting http://www.w3schools.com/js/js_date_formats.asp Link to comment Share on other sites More sharing options...
clangstaff Posted November 9, 2016 Author Share Posted November 9, 2016 Thanks for the response Graham, the W3 schools page is what I was working from trying to get a solution but I couldn't make much sense of it. I think I probably need to spend some time working from the very basics with JavaScript Link to comment Share on other sites More sharing options...
Graham Quince Posted November 10, 2016 Share Posted November 10, 2016 Had 5 minutes so got a chance to look at this properly: <p id="showDate"></p> <script> var a = moment().format('ddd Do MMMM'); $('#showDate').html(a); </script> Will give you: Thu 10th November This page (alnost hidden on MomentJS.com's site covers formatting) - http://momentjs.com/docs/#/displaying/ 1 Link to comment Share on other sites More sharing options...
clangstaff Posted November 11, 2016 Author Share Posted November 11, 2016 @Graham Quince Thank you for your help much appreciated. Link to comment Share on other sites More sharing options...
Sue Busher Posted March 7, 2017 Share Posted March 7, 2017 Thanks Graham. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now