https://a-egoist.github.io/js/jquery.barrager.js

1/**
2 *@name     jquery.barrager.js
3 *@version  1.1
4 *@author   [email protected]
5 *@url      https://github.com/yaseng/jquery.barrager.js
6 */
7(function($) {
8	$.fn.barrager = function(barrage) {
9		barrage = $.extend({
10			close: true,
11			max: 10,
12			speed: 16,
13			color: '#ffffff',
14		}, barrage || {});
15
16		const time = new Date().getTime();
17		const barrager_id = 'barrage_' + time;
18		const id = '#' + barrager_id;
19		const div_barrager = $("<div class='barrage' id='" + barrager_id + "'></div>").appendTo($(this));
20		const this_height = $(window).height() * 0.35;
21		const this_width = $(window).width() + 100;
22		const array = [
23			(this_height / 5) + $(window).height() * 0.5,
24			2*(this_height / 5) + $(window).height() * 0.5,
25			3*(this_height / 5) + $(window).height() * 0.5,
26			4*(this_height / 5) + $(window).height() * 0.5,
27			5*(this_height / 5)   + $(window).height() * 0.5
28		]
29		const bottom =array[Math.floor(Math.random()*5)];
30
31		div_barrager.css("bottom", bottom + "px");
32		div_barrager_box = $("<div class='barrage_box cl'></div>").appendTo(div_barrager);
33		if(barrage.img){
34			div_barrager_box.append("<a class='portrait z' href='javascript:;'></a>");
35			const img = $("<img src='' >").appendTo(id + " .barrage_box .portrait");
36			img.attr('src', barrage.img);
37		}
38		div_barrager_box.append(" <div class='z p'></div>");
39		if(barrage.close){
40			div_barrager_box.append(" <div class='close z'></div>");
41		}
42
43		const content = $("<a title='' href='' target='_blank'></a>").appendTo(id + " .barrage_box .p");
44		content.attr({
45			'href': barrage.href,
46			'id': barrage.id
47		}).empty().append(barrage.info);
48		content.css('color', barrage.color);
49
50		const i = 0;
51		div_barrager.css('margin-right', 0);
52		
53 		$(id).animate({right:this_width},barrage.speed*1000,function()
54		{
55			$(id).remove();
56		});
57
58		div_barrager_box.mouseover(function()
59		{
60		     $(id).stop(true);
61		});
62
63		div_barrager_box.mouseout(function()
64		{
65			$(id).animate({right:this_width},barrage.speed*1000,function()
66			{
67				$(id).remove();
68			});
69 		});
70
71		$(id+'.barrage .barrage_box .close').click(function()
72		{
73			$(id).remove();
74		})
75	}
76
77
78	$.fn.barrager.removeAll=function()
79	{
80		 $('.barrage').remove();
81	}
82
83})(jQuery);