Skip to content

HashirHussain/random-bg-color

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

random-bg-color

Play with background colors on any HTML elements.

Usage

  • Include
<script src="path/to/your/directory/random-bg-color.js">
OR
<script src="path/to/your/directory/random-bg-color.min.js">
  • Put
<script>bgColors.apply();</script>

Options

By default if no element is given, colors would be applied to <body> tag.You can pass list of elements by their classes or ids or by thier name itself. e.g.

  • Single element
bgColors.targetElements = '#myId'; or bgColors.targetElements = ['#myId'];
  • Multiple elements
bgColors.targetElements = ['#myId','#anotherId','#onemoreId'];
  • Mix elements
bgColors.targetElements = ['#myId','.myClass','.anotherClass','span'];

You can also pass selected list of colors e.g.

  • Multiple colors
bgColors.colors = ['#1abc9c', '#d3d3d3','#ffeeee'];
  • Only one color
bgColors.colors = '#1abc9c' or bgColors.colors = ['#1abc9c'];
More options
  • If you want to change colors without page reload set bgColors.autoChange value true. e.g.
bgColors.autoChange=true
  • You can set interval (in miliseconds) if you has set autoChange true. e.g.
bgColors.autoChangeDelay = 2000;// Only works if autoChange is true. 

Combining all along

<script type="text/javascript">
bgColors.targetElements = ['.t1','#g1','div'];
bgColors.colors = ['#1abc9c', '#d3d3d3'];
bgColors.apply();</script>
See Live Demo on fiddle
Stay tuned for more options ;)

About

Play with background colors on any HTML element

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors