Display a banner-link to promote Global Accessibility Awareness Day (GAAD). The banner displays for a configurable period before and after the day.
Join us on Thursday, May 18 2017 and mark the sixth Global Accessibility Awareness Day (GAAD). The purpose of GAAD is to get everyone talking, thinking and learning about digital (web, software, mobile, etc.) access/inclusion and people with different disabilities.
Built on Datejs.
Note ~ this is not an official widget!
- Added
?gaadwidget=force
URL parameter, #2 - Added iCal and JSON data files.
- Different after-event message - containing next year's date, #5 - thanks @srinivasu..
- Added translation into Français/French, #4
- Added neutral
black
theme, #2 - Changed default
days_after
from 5 to 10.
- Zero configuration required by default,
- Paste and forget - the banner appears 10 days before and disappears 10 days after,
- Configurable,
- Basic internationalization,
- Basic automated testing in place (Travis-CI),
- Accessible ~ let me know if you spot a problem!
- Responsive design,
- Compatible with all modern browsers, and MSIE 9-11,
- CDN courtesy of RawGit (thank you!) - with HTTPS/SSL.
npm install
npm run build
npm run build-min
npm test
Via RawGit - production / CDN:
<div id="id-gaad"></div>
<script src="https://cdn.rawgit.com/nfreear/gaad-widget/2.1-beta/build/GAAD.widget.js"></script>
Local hosting:
<div id="id-gaad"></div>
<script src="build/GAAD.widget.js" ></script>
Setting the days_before
option:
<div id="id-gaad"></div>
<script src="build/GAAD.widget.js" data-gaad='{ "days_before": 20 }'></script>
Setting several configuration options:
<div id="custom_id"></div>
<script
src="build/GAAD.widget.js"
data-gaad='{ "id": "custom_id", "days_after": 10, "theme": "black", "debug": true }'
></script>
Français (French):
<div id="id-gaad"></div>
<script src="build/GAAD.widget.js" data-gaad='{ "lang": "fr" }' ></script>
License: MIT.
Twitter: @nfreear, @gbla11yday.