Skip to content

Commit aee9141

Browse files
author
hikki
committed
选择标识
1 parent 3c73842 commit aee9141

File tree

2 files changed

+36
-5
lines changed

2 files changed

+36
-5
lines changed

‎resources/assets/component.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
-webkit-user-select: none!important;
1212
-ms-user-select: none!important;
1313
user-select: none!important;
14+
text-align: left;
1415
}
1516
.dlp i{cursor: pointer!important;}
1617
.dlp p{margin: 0!important;}

‎test/index.html

Lines changed: 35 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,45 @@
77
<script src="../resources/assets/component.js"></script>
88
</head>
99
<body>
10-
<div id="test" style="width: 550px;height: 200px"></div>
10+
<svg style="position: absolute;top:0;left: 0;right: 0;bottom: 0;" xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 3500'><rect fill='#ffffff' width='2000' height='1500'/><defs><rect stroke='#ffffff' stroke-width='.5' width='1' height='1' id='s'/><pattern id='a' width='3' height='3' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><use fill='#fcfcfc' href='#s' y='2'/><use fill='#fcfcfc' href='#s' x='1' y='2'/><use fill='#fafafa' href='#s' x='2' y='2'/><use fill='#fafafa' href='#s'/><use fill='#f7f7f7' href='#s' x='2'/><use fill='#f7f7f7' href='#s' x='1' y='1'/></pattern><pattern id='b' width='7' height='11' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#f5f5f5'><use href='#s'/><use href='#s' y='5' /><use href='#s' x='1' y='10'/><use href='#s' x='2' y='1'/><use href='#s' x='2' y='4'/><use href='#s' x='3' y='8'/><use href='#s' x='4' y='3'/><use href='#s' x='4' y='7'/><use href='#s' x='5' y='2'/><use href='#s' x='5' y='6'/><use href='#s' x='6' y='9'/></g></pattern><pattern id='h' width='5' height='13' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#f5f5f5'><use href='#s' y='5'/><use href='#s' y='8'/><use href='#s' x='1' y='1'/><use href='#s' x='1' y='9'/><use href='#s' x='1' y='12'/><use href='#s' x='2'/><use href='#s' x='2' y='4'/><use href='#s' x='3' y='2'/><use href='#s' x='3' y='6'/><use href='#s' x='3' y='11'/><use href='#s' x='4' y='3'/><use href='#s' x='4' y='7'/><use href='#s' x='4' y='10'/></g></pattern><pattern id='c' width='17' height='13' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#f2f2f2'><use href='#s' y='11'/><use href='#s' x='2' y='9'/><use href='#s' x='5' y='12'/><use href='#s' x='9' y='4'/><use href='#s' x='12' y='1'/><use href='#s' x='16' y='6'/></g></pattern><pattern id='d' width='19' height='17' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#ffffff'><use href='#s' y='9'/><use href='#s' x='16' y='5'/><use href='#s' x='14' y='2'/><use href='#s' x='11' y='11'/><use href='#s' x='6' y='14'/></g><g fill='#efefef'><use href='#s' x='3' y='13'/><use href='#s' x='9' y='7'/><use href='#s' x='13' y='10'/><use href='#s' x='15' y='4'/><use href='#s' x='18' y='1'/></g></pattern><pattern id='e' width='47' height='53' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#F60'><use href='#s' x='2' y='5'/><use href='#s' x='16' y='38'/><use href='#s' x='46' y='42'/><use href='#s' x='29' y='20'/></g></pattern><pattern id='f' width='59' height='71' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#F60'><use href='#s' x='33' y='13'/><use href='#s' x='27' y='54'/><use href='#s' x='55' y='55'/></g></pattern><pattern id='g' width='139' height='97' patternUnits='userSpaceOnUse' patternTransform='scale(50) translate(-980 -735)'><g fill='#F60'><use href='#s' x='11' y='8'/><use href='#s' x='51' y='13'/><use href='#s' x='17' y='73'/><use href='#s' x='99' y='57'/></g></pattern></defs><rect fill='url(#a)' width='100%' height='100%'/><rect fill='url(#b)' width='100%' height='100%'/><rect fill='url(#h)' width='100%' height='100%'/><rect fill='url(#c)' width='100%' height='100%'/><rect fill='url(#d)' width='100%' height='100%'/><rect fill='url(#e)' width='100%' height='100%'/><rect fill='url(#f)' width='100%' height='100%'/><rect fill='url(#g)' width='100%' height='100%'/></svg>
11+
<div style="position: absolute;z-index: 1000;top:0;left: 0;right: 0;bottom: 0;">
1112
<div style="height: 30px"></div>
12-
<div id="test4" style="width: 650px;height: 360px"></div>
13+
<div id="test" style="width: 550px;height: 200px;margin: 0 auto"></div>
1314
<div style="height: 30px"></div>
14-
<div id="test3">点击弹窗</div>
15+
<div id="test4" style="width: 650px;height: 360px;margin: 0 auto"></div>
1516
<div style="height: 30px"></div>
16-
<div id="test5" style="width: 650px;height: 360px"></div>
17+
<div id="test3" style="height: 120px;background: rgb(34 36 38 / 15%);text-align: center">
18+
<?xml version="1.0" encoding="utf-8"?><svg xml:space="preserve" viewBox="0 0 100 100" y="0px" x="0px" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="圖層_1" version="1.1" width="66px" height="66px" style="height:100%;background-size:initial;background-repeat-y:initial;background-repeat-x:initial;background-position-y:initial;background-position-x:initial;background-origin:initial;background-image:initial;background-color:rgb(255, 255, 255);background-clip:initial;background-attachment:initial;animation-play-state:paused" ><g class="ldl-scale" style="transform-origin:50% 50%;transform:rotate(0deg) scale(0.8, 0.8);animation-play-state:paused" ><g style="animation-play-state:paused" ><path d="M42.24,20.75c0,8.12-6.27,14.7-14,14.7s-14-6.58-14-14.7s14-14.7,14-14.7S42.24,12.63,42.24,20.75z" fill="#8C6239" style="fill:rgb(140, 98, 57);animation-play-state:paused" ></path>
19+
<path d="M35.87,20.75c0,4.43-3.42,8.02-7.63,8.02s-7.63-3.59-7.63-8.02s7.63-8.02,7.63-8.02 S35.87,16.32,35.87,20.75z" fill="#F2E3E7" style="fill:rgb(242, 227, 231);animation-play-state:paused" ></path></g>
20+
<g style="animation-play-state:paused" ><path d="M57.94,20.75c0,8.12,6.27,14.7,14,14.7s14-6.58,14-14.7s-14-14.7-14-14.7S57.94,12.63,57.94,20.75z" fill="#8C6239" style="fill:rgb(140, 98, 57);animation-play-state:paused" ></path>
21+
<path d="M64.3,20.75c0,4.43,3.42,8.02,7.63,8.02s7.63-3.59,7.63-8.02s-7.63-8.02-7.63-8.02S64.3,16.32,64.3,20.75z" fill="#F2E3E7" style="fill:rgb(242, 227, 231);animation-play-state:paused" ></path></g>
22+
<g style="animation-play-state:paused" ><path d="M93.37,53.62h-7.43l5.36-7.17h-5.36V20.97H14.24v25.48H8.71l5.36,7.17H6.63l7.61,8.95v7.26 c0,11.6,9.4,21,21,21h29.69c11.6,0,21-9.4,21-21v-7.47L93.37,53.62z" fill="#8C6239" style="fill:rgb(140, 98, 57);animation-play-state:paused" ></path>
23+
<path d="M38.16,20.97c-0.11,1.48-0.15,3.54,0.18,5.95c0.87,6.24,3.88,11.98,4.98,11.67 c0.66-0.18,0.31-2.44,0.48-11.31c0.05-2.64,0.12-4.83,0.18-6.3H38.16z" fill="#42210B" style="fill:rgb(66, 33, 11);animation-play-state:paused" ></path>
24+
<path d="M61.82,20.97c0.11,1.48,0.15,3.54-0.18,5.95c-0.87,6.24-3.88,11.98-4.98,11.67 c-0.66-0.18-0.31-2.44-0.48-11.31c-0.05-2.64-0.12-4.83-0.18-6.3H61.82z" fill="#42210B" style="fill:rgb(66, 33, 11);animation-play-state:paused" ></path>
25+
<path d="M53,21.02c0.02,1.84-0.02,4.53-0.34,7.76c-0.1,0.99-1.15,11.32-2.57,11.32c-1.25,0-2.3-8.01-2.64-11.73 c-0.28-3.05-0.3-5.6-0.27-7.35H53z" fill="#42210B" style="fill:rgb(66, 33, 11);animation-play-state:paused" ></path></g>
26+
<g style="animation-play-state:paused" ><ellipse ry="5.07" rx="4.83" cy="47.11" cx="65.38" style="animation-play-state:paused" ></ellipse>
27+
<ellipse ry="5.07" rx="4.83" cy="47.11" cx="34.79" style="animation-play-state:paused" ></ellipse></g>
28+
<g style="animation-play-state:paused" ><path d="M66.78,70.88c1.69-0.86,3.97-2.2,6.38-4.23c6.25-5.25,10.53-12.72,9.47-13.83 c-0.64-0.67-2.87,1.27-12.69,7.06c-2.93,1.73-5.36,3.11-7.02,4.03L66.78,70.88z" fill="#FFFFFF" style="fill:rgb(255, 255, 255);animation-play-state:paused" ></path>
29+
<path d="M33.36,70.88c-1.69-0.86-3.97-2.2-6.38-4.23c-6.25-5.25-10.53-12.72-9.47-13.83 c0.64-0.67,2.87,1.27,12.69,7.06c2.93,1.73,5.36,3.11,7.02,4.03L33.36,70.88z" fill="#FFFFFF" style="fill:rgb(255, 255, 255);animation-play-state:paused" ></path>
30+
<g style="animation-play-state:paused" ><ellipse ry="12.98" rx="17.86" cy="67.73" cx="50.09" fill="#F2E3E7" style="fill:rgb(242, 227, 231);animation-play-state:paused" ></ellipse>
31+
<g style="animation-play-state:paused" ><ellipse ry="5.07" rx="3.43" cy="67.46" cx="58.67" style="animation-play-state:paused" ></ellipse>
32+
<ellipse ry="5.07" rx="3.43" cy="67.46" cx="41.51" style="animation-play-state:paused" ></ellipse></g></g></g>
33+
<metadata xmlns:d="https://loading.io/stock/" style="animation-play-state:paused" ><d:name style="animation-play-state:paused" >animal</d:name>
34+
35+
36+
<d:tags style="animation-play-state:paused" >animal,pig,boar,wild,zoo,cute</d:tags>
37+
38+
39+
<d:license style="animation-play-state:paused" >by</d:license>
40+
41+
42+
<d:slug style="animation-play-state:paused" >kproeo</d:slug></metadata></g><!-- generated by https://loading.io/ --></svg>
43+
</div>
44+
<div style="height: 30px"></div>
45+
<div id="test5" style="width: 650px;height: 360px;margin: 0 auto"></div>
1746
<div style="height: 30px"></div>
18-
<div id="test2" style="width: 900px;height: 320px"></div>
47+
<div id="test2" style="width: 900px;height: 320px;margin: 0 auto"></div>
48+
</div>
1949
</body>
2050
<script>
2151
new ComponentDot('test',[2,5,10],{"2":"西宮このみ","5":"瀨名光莉","7":"日菜々はのん","10":"波多野結衣","11":"麻生希","15":"美波沙耶","17":"佐山愛","18":"真木今日子","20":"通野未帆","21":"三上悠亜","23":"初美沙希","31":"AIKA -","33":"永井みひな","36":"河北彩花","38":"村田ちか","42":"関根奈美","44":"浅田結梨","45":"JULIA","47":"春原未来","56":"神咲詩織","59":"小西悠","62":"夏希みなみ","64":"小早川怜子","65":"鈴木心春","66":"斉藤みゆ","67":"斎藤ミオリ","71":"高杉麻里","72":"谷原希美","73":"山岸逢花","74":"三島奈津子","77":"仲里紗羽","78":"松下紗栄子","79":"立花瑠莉","80":"北條麻妃","81":"葵司","82":"妃月るい","85":"涼川絢音","88":"長谷川るい","90":"二宮和香","92":"江上しほ","94":"天野美優","97":"神ユキ","99":"ゆうひ菜那","100":"葵千恵","101":"三浦歩美","102":"希美まゆ","106":"吉沢明歩","108":"奥田咲","112":"木南日菜","113":"上原亜衣","114":"紗々原ゆり","117":"一条綺美香","118":"友田彩也香","120":"向井藍","121":"麻里梨夏","122":"若月みいな","123":"林美玲","124":"湊莉久","127":"なつめ愛梨","128":"吉川蓮","129":"沖田杏梨","136":"美谷朱里","137":"白石未央","140":"桜木優希音","145":"あず希","147":"小野寺梨紗","148":"栄川乃亜","149":"戸田真琴","150":"織田真子","151":"蓮實克蕾兒","152":"ちなみん","155":"由愛可奈","159":"白石茉莉奈","160":"五十嵐星蘭","161":"浜崎真緒","164":"桜木凛","169":"野々宮みさと","171":"本田岬","172":"星咲伶美","174":"安位カヲル","179":"南梨央奈","182":"塚田詩織","183":"七瀬あいり","184":"大浦真奈美","187":"早川瀬里奈","190":"羽田希","192":"愛世くらら","193":"神波多一花","194":"秋山祥子","197":"芦名ユリア","201":"若菜奈央","202":"三浦恵理子","204":"白木優子","205":"東凛","209":"結まきな","210":"尾上若葉","211":"水野朝陽","214":"笹倉杏","218":"澤村レイコ","220":"西野翔","223":"舞島あかり","225":"佐倉絆","226":"百合川雅","227":"神坂朋子","228":"若月まりあ","229":"松本菜奈実","230":"水沢のの","231":"小野夕子","232":"神谷充希","234":"NAOMI","237":"翔田千里","238":"有坂深雪","242":"碧しの","244":"愛瀬美希","245":"香西咲","250":"神坂ひなの","252":"水原さな","253":"仁科百華","254":"心花ゆら","255":"星川光希","256":"宮下華奈","257":"成瀬心美","258":"椎名由奈","259":"丘咲エミリ","260":"市来まひろ","261":"横山みれい","264":"白石りん","265":"有本紗世","266":"赤渕蓮","267":"琴水せいら","268":"妃乃ひかり","269":"桃咲ゆり菜","270":"倉持りん","271":"早乙女ゆい","272":"紗東みお","274":"星乃月","276":"藤川れいな","277":"西田那津","278":"葉月奈穂","280":"桐島美奈子","281":"鈴木真夕","282":"真白愛梨","283":"山本美和子","284":"牧村彩香","287":"美月恋","288":"かすみりさ","289":"涼宮琴音","290":"中里美穂","292":"木村つな","293":"桐原あずさ","294":"ひなた澪","295":"今井真由美","297":"神山なな","298":"椎葉みくる","299":"佐伯奈々","300":"小谷みのり"});

0 commit comments

Comments
 (0)