其他代码

Starlight 背景动画特效jQuery插件

阿里云


starlight.js 是一款 jQuery 背景动画特效插件。该插件可以为页面添加随机动画的星星、圆形或其它形状的背景动画特效。

使用方法

在页面中引入下面的文件。

也想出现在这里?联系我们
创客主机
  1. <script src="/path/to/jquery.js"></script>
  2. <script src="/path/to/starlight.js"></script>

HTML 结构

为你想要添加背景动画的容器添加 starlight class。

  1. <body class="starlight">
  2.   content here
  3. </body>

配置参数

  1. var user_configuration={
  2.  
  3.     // "circle" or "square"
  4.     shape:"circle",
  5.  
  6.     // star size in pixels
  7.     initial_size:"12px",
  8.  
  9.     // final size of the stars after expansion 
  10.     final_size:"64px", 
  11.  
  12.     // how fast the stars get bigger, in milliseconds
  13.     expand_speed:"1s", 
  14.  
  15.     // how long until the star fades out
  16.     fade_delay:"0.5s", 
  17.  
  18.     // how long the star fades for
  19.     fade_duration:"0.5s", 
  20.  
  21.     // The variety of colors of the stars. Can be any CSS complient color (eg. HEX, rgba, hsl)
  22.     colors:["hsla(62, 50%,50%, 0.5)", "rgba(255,255,255,0.5)","hsla(180, 72%, 52%, 0.5)"], 
  23.  
  24.     // how often a new wave of stars pop-out (in milliseconds. Bigger==longer)
  25.     frequency:100, 
  26.  
  27.     // how many stars pop out per wave
  28.     density: 1,
  29.  
  30.     // whether the stars disappear after they are created
  31.     keep_lit: false, 
  32.  
  33.     // whether the stars rotate through out their expansion
  34.     rotation: true, 
  35.  
  36.     // how much of the element's area the stars will show up in (0-1)
  37.     coverage:1, 
  38.  
  39.     // the elements the script will target based on the class name
  40.     target_class:'.starlight'
  41.  
  42. };

Github 网址:https://github.com/sergei1152/Starlight.js

Starlight 背景动画特效 jQuery 插件

已有 493 人购买
  • 9xmt
查看演示升级 VIP立刻购买

演示地址 下载地址
收藏
(0)

发表回复

热销模板

Ashade - 作品展示摄影相册WordPress汉化主题
LensNews

本站承接 WordPress / PbootCMS / DedeCMS 等
系统建站、仿站、开发、定制等业务!