jQuery - Show/Hide Elements on certain date & time? -



jQuery - Show/Hide Elements on certain date & time? -

so i've been challenged task of "stunting" events. i'm new jquery, i'm kind of learning on go. said i'd give best shot , after googling around think i've made start have no thought on how continue. here phone call help! :)

here's what's been requested:

the user wants ability to

set start date [dd/mm/yyyy] set end date set start time [hh:mm] set end time add url add new bg image path

so end result like:

before start date - [original banner] start date end date - [stunt banner] after end date - [original banner]

i kind of need do, , think i've made start - i'm i've got code mixed , in wrong places!

any direction great!

here's fiddle of have far: http://jsfiddle.net/sfe0hs4v/1/

here's list of variables i'd end user able change:

var target = $('#stuntevent'); var startdate = "04/10/2014"; var starttime = "09:00"; var enddate = "06/10/2014"; var endtime = "08:59"; var url = "http://www.google.co.uk"; var bgimg = "http://i.imgur.com/npe3pkm.gif";

thanks!

ok have done something, don't know if it's expect. thing utilize html5 info types pass info js script, such starting/ending date , time of event, url , background url. implies able edit way events printed page can incorporate elements.

class="snippet-code-js lang-js prettyprint-override">(function ($) { function stuntevent(target) { var startdate = new date(target.data("start-date")), enddate = new date(target.data("end-date")), url = target.data("href"), bgimg = target.data("bg-img"); if (startdate <= fulldate && fulldate <= enddate) { target.prop('href', url); target.css({"background": "url(" + bgimg + ") center no-repeat #fff"}); } } var fulldate = new date(); stuntevent($('#stuntevent')); })(jquery); class="snippet-code-css lang-css prettyprint-override">body { background: #333; } #stuntevent { width: 300px; height: 200px; background: url('http://i.imgur.com/ewoioyd.gif') center no-repeat #ffffff; display: block; } class="snippet-code-html lang-html prettyprint-override"><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a id="stuntevent" data-start-date="10/04/2014 14:00" data-end-date="10/06/2014 17:00" data-bg-img="http://i.imgur.com/npe3pkm.gif" data-href="http://www.google.co.uk"></a>

jquery

Comments

Popular posts from this blog

formatting - SAS SQL Datepart function returning odd values -

c++ - Apple Mach-O Linker Error(Duplicate Symbols For Architecture armv7) -

php - Yii 2: Unable to find a class into the extension 'yii2-admin' -