mirror of
https://gitee.com/lvyeyou/DaShuJuZhiDaPingZhanShi.git
synced 2025-08-02 04:42:33 +08:00
删除目录10.大屏音乐
This commit is contained in:
Lang
Gitee
parent
d5c254ae7d
commit
e5f2dadbce
1098
10.大屏音乐/css/animate.css
vendored
1098
10.大屏音乐/css/animate.css
vendored
File diff suppressed because it is too large
Load Diff
4164
10.大屏音乐/css/app.css
4164
10.大屏音乐/css/app.css
File diff suppressed because it is too large
Load Diff
@ -1,591 +0,0 @@
|
|||||||
/*-----------------------------------------------------------------------------
|
|
||||||
|
|
||||||
- Before-After -
|
|
||||||
|
|
||||||
Screen Stylesheet
|
|
||||||
|
|
||||||
version: 1.0
|
|
||||||
date: 07/27/11
|
|
||||||
author: freshline
|
|
||||||
email: support@version-four.com
|
|
||||||
website: http://www.version-four.com
|
|
||||||
-----------------------------------------------------------------------------*/
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*------------------------------------------------
|
|
||||||
TexBoxes includes Divs (images, texts etc.)
|
|
||||||
Add as many Textboxes as you wish. Even more on one slide
|
|
||||||
Divs in Textboxes are relative positioned
|
|
||||||
Each Div is animated at start of the slide.
|
|
||||||
One by one, with delay set via HTMML.
|
|
||||||
|
|
||||||
Transition Classes (Defined in the HTML as Class on DIV's):
|
|
||||||
slidedown, slideup, slideleft, slideright
|
|
||||||
fadedown, fadeup, fadeleft and faderight
|
|
||||||
--------------------------------------------------*/
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 1 - TextBox 1
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_1 {
|
|
||||||
width:180px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_1 #logo {
|
|
||||||
left:59px;
|
|
||||||
top:110px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_1 #title {
|
|
||||||
font-size:22px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #184ea8;
|
|
||||||
left:37px;
|
|
||||||
top:214px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_1 #title_1b {
|
|
||||||
font-size:22px;
|
|
||||||
font-weight:normal;
|
|
||||||
text-align:center;
|
|
||||||
color: #fff;
|
|
||||||
left:687px;
|
|
||||||
top:169px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_1 #description {
|
|
||||||
font-size:12px;
|
|
||||||
text-align:center;
|
|
||||||
color: #1f2120;
|
|
||||||
left:20px;
|
|
||||||
top:250px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 2 - TextBox 2
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_2 {
|
|
||||||
width:780px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_2 #logo_2 {
|
|
||||||
left:509px;
|
|
||||||
top:84px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_2 #description_2 {
|
|
||||||
font-size:11px;
|
|
||||||
color: #57414e;
|
|
||||||
left:557px;
|
|
||||||
top:132px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 3 - TextBox 3
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_3 {
|
|
||||||
width:280px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_3 #title_3 {
|
|
||||||
font-size:22px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #fff;
|
|
||||||
left:67px;
|
|
||||||
top:75px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 4 - TextBox 4
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_4 {
|
|
||||||
width:680px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_4 #logo_4 {
|
|
||||||
left:569px;
|
|
||||||
top:110px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_4 #description_4 {
|
|
||||||
font-size:11px;
|
|
||||||
text-align:center;
|
|
||||||
color: #524754;
|
|
||||||
left:606px;
|
|
||||||
top:245px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#description_4 a{
|
|
||||||
text-decoration:none;
|
|
||||||
color: #524754;
|
|
||||||
}
|
|
||||||
|
|
||||||
#description_4 a:hover {
|
|
||||||
text-decoration:underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 5 - TextBox 5
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_5 {
|
|
||||||
width:880px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_5 #title_5 {
|
|
||||||
font-size:40px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #fff;
|
|
||||||
filter:alpha(opacity=75);
|
|
||||||
-moz-opacity:0.75;
|
|
||||||
-khtml-opacity:0.75;
|
|
||||||
opacity:0.75;
|
|
||||||
left:248px;
|
|
||||||
top:54px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 1/6 - TextBox 6
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_6 {
|
|
||||||
width:880px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_6 #title_6 {
|
|
||||||
font-size:22px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #d5c9b9;
|
|
||||||
left:559px;
|
|
||||||
top:80px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_6 #logo_6 {
|
|
||||||
left:487px;
|
|
||||||
top:44px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_6 #description_6 {
|
|
||||||
font-size:12px;
|
|
||||||
color: #d5c9b9;
|
|
||||||
left:560px;
|
|
||||||
top:126px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 1/7 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_7 {
|
|
||||||
width:220px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:200;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_7 #logo_7 {
|
|
||||||
left:41px;
|
|
||||||
top:70px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_7 #logo_7b {
|
|
||||||
left:49px;
|
|
||||||
top:0px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_7 #description_7{
|
|
||||||
font-size:12px;
|
|
||||||
text-align:center;
|
|
||||||
color: #823723;
|
|
||||||
left:67px;
|
|
||||||
top:152px;
|
|
||||||
position:absolute;
|
|
||||||
|
|
||||||
}
|
|
||||||
#description_7 a{
|
|
||||||
text-decoration:none;
|
|
||||||
color: #5696bc;
|
|
||||||
}
|
|
||||||
|
|
||||||
#description_7 a:hover {
|
|
||||||
text-decoration:underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 1/8 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_8 {
|
|
||||||
width:351px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:200;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_8 #logo_8 {
|
|
||||||
left:77px;
|
|
||||||
top:55px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_8 #title_8 {
|
|
||||||
font-size:24px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #faf6f2;
|
|
||||||
left:97px;
|
|
||||||
top:162px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_8 #description_8 {
|
|
||||||
font-size:12px;
|
|
||||||
color: #faf6f2;
|
|
||||||
left:97px;
|
|
||||||
top:239px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 1/9 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_9 {
|
|
||||||
width:890px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_9 #logo_9 {
|
|
||||||
left:461px;
|
|
||||||
top:77px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_9 #title_9 {
|
|
||||||
font-size:22px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #d7cdc5;
|
|
||||||
left:480px;
|
|
||||||
top:192px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_9 #description_9 {
|
|
||||||
font-size:12px;
|
|
||||||
color: #1f2120;
|
|
||||||
left:481px;
|
|
||||||
top:233px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 1/10 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_10 {
|
|
||||||
width:880px;
|
|
||||||
height:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_10 #title_10 {
|
|
||||||
font-size:52.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #d6d8cc;
|
|
||||||
left:512px;
|
|
||||||
top:69px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_10 #description_10 {
|
|
||||||
font-size:88px;
|
|
||||||
color: #1f2120;
|
|
||||||
left:510px;
|
|
||||||
top:131px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 3/1 - TextBox 11
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_11 {
|
|
||||||
width:496px;
|
|
||||||
height:264px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_11 #title_11 {
|
|
||||||
font-size:20.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #fff;
|
|
||||||
left:22px;
|
|
||||||
top:119px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 3/2 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_12 {
|
|
||||||
width:200px;
|
|
||||||
height:200px;
|
|
||||||
position:absolute;
|
|
||||||
top:180px;
|
|
||||||
left:270px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_12 #title_12 {
|
|
||||||
font-size:20.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
text-align:center;
|
|
||||||
color: #000;
|
|
||||||
position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 3/3 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_13 {
|
|
||||||
width:200px;
|
|
||||||
height:200px;
|
|
||||||
position:absolute;
|
|
||||||
top:170px;
|
|
||||||
left:270px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_13 #title_13 {
|
|
||||||
font-size:20.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
text-align:center;
|
|
||||||
color: #000;
|
|
||||||
position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_13 #logo_13 {
|
|
||||||
left:-168px;
|
|
||||||
top:-139px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_13b {
|
|
||||||
width:200px;
|
|
||||||
height:200px;
|
|
||||||
position:absolute;
|
|
||||||
top:258px;
|
|
||||||
left:270px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_13b #title_13b {
|
|
||||||
font-size:18.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
text-align:center;
|
|
||||||
color: #fff;
|
|
||||||
position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_13c {
|
|
||||||
width:200px;
|
|
||||||
height:200px;
|
|
||||||
position:absolute;
|
|
||||||
top:254px;
|
|
||||||
left:24px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_13c #title_13c {
|
|
||||||
font-size:9.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
text-align:left;
|
|
||||||
color: #daae7b;
|
|
||||||
position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------
|
|
||||||
- BANNER 3/4 - TextBox
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
#textbox_green {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_green #green {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:270px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_green2 {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_green2 #green2 {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:250px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_code {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_code #code {
|
|
||||||
position:absolute;
|
|
||||||
top:127px;
|
|
||||||
left:-1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_fish {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_fish #fish {
|
|
||||||
position:absolute;
|
|
||||||
top:46px;
|
|
||||||
left:201px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_points {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_points #points {
|
|
||||||
position:absolute;
|
|
||||||
top:49px;
|
|
||||||
left:191px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_14b {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_14b #title_14 {
|
|
||||||
font-size:38.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #1f2120;
|
|
||||||
top:93px;
|
|
||||||
left:34px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#textbox_14a {
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_14a #title_14 {
|
|
||||||
font-size:38.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #1f2120;
|
|
||||||
top:93px;
|
|
||||||
left:34px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#textbox_14c {
|
|
||||||
position:absolute;
|
|
||||||
width:200px;
|
|
||||||
height:200px;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
z-index:800;
|
|
||||||
}
|
|
||||||
|
|
||||||
#textbox_14c #title_14c{
|
|
||||||
font-size:38.5px;
|
|
||||||
font-weight:normal;
|
|
||||||
color: #1f2120;
|
|
||||||
top:48px;
|
|
||||||
left:34px;
|
|
||||||
position:absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
@ -1,806 +0,0 @@
|
|||||||
/*-----------------------------------------------------------------------------
|
|
||||||
|
|
||||||
- Before-After -
|
|
||||||
|
|
||||||
Screen Stylesheet
|
|
||||||
|
|
||||||
version: 1.0
|
|
||||||
date: 07/27/11
|
|
||||||
author: freshline
|
|
||||||
email: support@version-four.com
|
|
||||||
website: http://www.version-four.com
|
|
||||||
-----------------------------------------------------------------------------*/
|
|
||||||
|
|
||||||
|
|
||||||
/*-----------------------------------------
|
|
||||||
- Shadow Effects for the Banner -
|
|
||||||
-------------------------------------------*/
|
|
||||||
.shadow1 {
|
|
||||||
-webkit-box-shadow: 0px 40px 55px -40px #000;
|
|
||||||
-moz-box-shadow: 0px 40px 55px -40px #000;
|
|
||||||
box-shadow: 0px 40px 55px -40px #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shadow2 {
|
|
||||||
-webkit-box-shadow: inset 0px 0px 6px 2px #7e7f7f;
|
|
||||||
-moz-box-shadow: inset 0px 0px 6px 2px #7e7f7f;
|
|
||||||
box-shadow: inset 0px 0px 6px 2px #7e7f7f;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shadow3 {
|
|
||||||
-webkit-box-shadow: 30px 10px 60px -20px #000;
|
|
||||||
-moz-box-shadow: 30px 10px 60px -20px #000;
|
|
||||||
box-shadow: 30px 10px 60px -20px #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*#####################
|
|
||||||
- VERSION I.
|
|
||||||
#####################*/
|
|
||||||
|
|
||||||
/*---------------------------------------
|
|
||||||
- CLEARING THE DEFAULT SETTINGS -
|
|
||||||
-----------------------------------------*/
|
|
||||||
.beforeafter_slider ul, li {
|
|
||||||
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------------
|
|
||||||
- Centered Banner, with 10px White Border -
|
|
||||||
- Standard Font for Each Slide -
|
|
||||||
- Rounded Border -
|
|
||||||
---------------------------------------------------*/
|
|
||||||
.beforeafter_slider {
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
display:none;
|
|
||||||
padding-left:10px;
|
|
||||||
padding-right:10px;
|
|
||||||
padding-top:10px;
|
|
||||||
padding-bottom:10px;
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
color: #000;
|
|
||||||
background-color:#fff;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------------------------------
|
|
||||||
- Rounded Mask on Images -
|
|
||||||
--------------------------------*/
|
|
||||||
.beforeafter_slider #mask {
|
|
||||||
position:absolute;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------------
|
|
||||||
- The Loader Size, Source and position on the Banner
|
|
||||||
----------------------------------------------------------*/
|
|
||||||
.beforeafter_slider .loader{
|
|
||||||
background-image:url(../images/loader/loader_round_blue.gif);
|
|
||||||
background-repeat:none;
|
|
||||||
width:18px;
|
|
||||||
height:18px;
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
top:45%;
|
|
||||||
z-index:1000;
|
|
||||||
position:relative;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.beforeafter_slider .timer, .beforeafter_slider_3 .timer{
|
|
||||||
background-image:url(../images/loader/timer_black.png);
|
|
||||||
position:relative;
|
|
||||||
width:10px;
|
|
||||||
height:10px;
|
|
||||||
background-position:0px 0px;
|
|
||||||
top:6px;
|
|
||||||
left:6px;
|
|
||||||
z-index:1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.beforeafter_slider_2 .timer{
|
|
||||||
background-image:url(../images/loader/timer_white.png);
|
|
||||||
position:relative;
|
|
||||||
width:10px;
|
|
||||||
height:10px;
|
|
||||||
background-position:0px 0px;
|
|
||||||
top:6px;
|
|
||||||
left:6px;
|
|
||||||
z-index:1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------
|
|
||||||
- The Logo in the right top Corner -
|
|
||||||
----------------------------------------------*/
|
|
||||||
.beforeafter_slider #bannerlogo {
|
|
||||||
position:absolute;
|
|
||||||
left:765px;
|
|
||||||
top:5px;
|
|
||||||
z-index:1500;
|
|
||||||
cursor:point;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.beforeafter_slider #bannerlogo img{
|
|
||||||
border-style:none;
|
|
||||||
border:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#bannerlogo a:link {border:none;}
|
|
||||||
#bannerlogo a:visited {border:none;}
|
|
||||||
|
|
||||||
|
|
||||||
/*----------------------------------------------------------------
|
|
||||||
- Image Thumbnails, borders, Marings, rounded corners -
|
|
||||||
------------------------------------------------------------------*/
|
|
||||||
.beforeafter_slider #image_thumbnail{
|
|
||||||
width:146px;
|
|
||||||
height:50px;
|
|
||||||
position:absolute;
|
|
||||||
background-color:#fff;
|
|
||||||
margin-left:-60px;
|
|
||||||
margin-top:-51px;
|
|
||||||
-webkit-border-radius:3px;
|
|
||||||
-moz-border-radius: 3px;
|
|
||||||
border-radius: 3px;
|
|
||||||
-webkit-box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
-moz-box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*---------------------------------------------------
|
|
||||||
- Small Arrow under the Image Thumbnails -
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
.beforeafter_slider #image_thumbnail_arrow{
|
|
||||||
width:9px;
|
|
||||||
height:5px;
|
|
||||||
background-image:url(../images/navigation/arrow_down_white.png);
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
position:absolute;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Toolbox (thumbnail, next,prev holder)
|
|
||||||
---------------------------------------------*/
|
|
||||||
.beforeafter_slider #toolbox {
|
|
||||||
/*display:none;*/
|
|
||||||
background-color:#1f2120;
|
|
||||||
width:auto;
|
|
||||||
height:40px;
|
|
||||||
position:relative;
|
|
||||||
top:285px;
|
|
||||||
float:right;
|
|
||||||
margin-right:18px;
|
|
||||||
padding-left:10px;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
-webkit-box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
-moz-box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------
|
|
||||||
- Toolbox - Next Button -
|
|
||||||
--------------------------------------*/
|
|
||||||
.beforeafter_slider #toolbox #next {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:5px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/nextprev.png);
|
|
||||||
background-position:top left;
|
|
||||||
width:28px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------
|
|
||||||
- Toolbox - Prev Button -
|
|
||||||
--------------------------------------*/
|
|
||||||
.beforeafter_slider #toolbox #previous {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:15px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/nextprev.png);
|
|
||||||
background-position:top right;
|
|
||||||
width:28px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------------------------------------------
|
|
||||||
- Toolbox - divider between buttons -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider #toolbox #mini_divider {
|
|
||||||
margin-top:5px;
|
|
||||||
margin-left:10px;
|
|
||||||
margin-right:10px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/toolbar_separator.png);
|
|
||||||
width:2px;
|
|
||||||
height:28px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-----------------------------------------
|
|
||||||
- Toolbox - Mini Thumbnail Buttons -
|
|
||||||
-------------------------------------------*/
|
|
||||||
.beforeafter_slider #toolbox .mini_thumbnail_buttons {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:2px;
|
|
||||||
margin-right:2px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/buttons.png);
|
|
||||||
background-position:top left;
|
|
||||||
width:22px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Before / After the Drag Button -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider #drag {
|
|
||||||
position:absolute;
|
|
||||||
background-image:url(../images/navigation/drag_h_white.png);
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
background-position:left top;
|
|
||||||
height:20px;
|
|
||||||
width:42px;
|
|
||||||
top:50%;
|
|
||||||
z-index:500;
|
|
||||||
cursor:pointer;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Before / After the Divider LINE -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider #divider{
|
|
||||||
position:absolute;
|
|
||||||
height:1000px;
|
|
||||||
z-index:202;
|
|
||||||
top:0px;
|
|
||||||
border-left:2px #fff solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*#####################
|
|
||||||
- VERSION II.
|
|
||||||
#####################*/
|
|
||||||
|
|
||||||
/*---------------------------------------
|
|
||||||
- CLEARING THE DEFAULT SETTINGS -
|
|
||||||
-----------------------------------------*/
|
|
||||||
.beforeafter_slider_2 ul, li {
|
|
||||||
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------------
|
|
||||||
- Centered Banner, with 10px White Border -
|
|
||||||
---------------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 {
|
|
||||||
|
|
||||||
display:none;
|
|
||||||
padding-left:30px;
|
|
||||||
padding-right:30px;
|
|
||||||
padding-top:30px;
|
|
||||||
padding-bottom:30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------------------------------
|
|
||||||
- Rounded Mask on Images -
|
|
||||||
--------------------------------*/
|
|
||||||
.beforeafter_slider_2 #mask {
|
|
||||||
position:absolute;
|
|
||||||
-webkit-border-radius:0px;
|
|
||||||
-moz-border-radius: 0px;
|
|
||||||
border-radius: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------
|
|
||||||
- Standard Font for Each Slide -
|
|
||||||
- Rounded Border -
|
|
||||||
---------------------------------*/
|
|
||||||
.beforeafter_slider_2 {
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
color: #000;
|
|
||||||
background-color:#fff;
|
|
||||||
background:url(../images/background/pattern/royal_line/royal_greyline_2.jpg);
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------------
|
|
||||||
- The Loader Size, Source and position on the Banner
|
|
||||||
----------------------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 .loader{
|
|
||||||
background-image:url(../images/loader/loader_round_black.gif);
|
|
||||||
background-repeat:none;
|
|
||||||
width:18px;
|
|
||||||
height:18px;
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
top:45%;
|
|
||||||
z-index:1000;
|
|
||||||
position:relative;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/*--------------------------------------------
|
|
||||||
- The Logo in the right top Corner -
|
|
||||||
----------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #bannerlogo {
|
|
||||||
position:absolute;
|
|
||||||
left:765px;
|
|
||||||
top:5px;
|
|
||||||
z-index:1500;
|
|
||||||
cursor:point;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.beforeafter_slider_2 #bannerlogo img{
|
|
||||||
border-style:none;
|
|
||||||
border:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*----------------------------------------------------------------
|
|
||||||
- Image Thumbnails, borders, Marings, rounded corners -
|
|
||||||
------------------------------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #image_thumbnail{
|
|
||||||
width:80px;
|
|
||||||
height:80px;
|
|
||||||
position:absolute;
|
|
||||||
background-color:#000;
|
|
||||||
margin-left:-27px;
|
|
||||||
margin-top:-81px;
|
|
||||||
-webkit-border-radius:5px;
|
|
||||||
-moz-border-radius: 5px;
|
|
||||||
border-radius: 5px;
|
|
||||||
-webkit-box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
-moz-box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*---------------------------------------------------
|
|
||||||
- Small Arrow under the Image Thumbnails -
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #image_thumbnail_arrow{
|
|
||||||
width:9px;
|
|
||||||
height:5px;
|
|
||||||
background-image:url(../images/navigation/arrow_down_black.png);
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
position:absolute;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Toolbox (thumbnail, next,prev holder)
|
|
||||||
---------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #toolbox {
|
|
||||||
/*display:none;*/
|
|
||||||
background-color:#fff;
|
|
||||||
background:url(../images/background/pattern/royal_line/royal_greyline_2.jpg);
|
|
||||||
width:auto;
|
|
||||||
height:40px;
|
|
||||||
position:absolute;
|
|
||||||
top:311px;
|
|
||||||
left:51px;
|
|
||||||
float:right;
|
|
||||||
margin-right:18px;
|
|
||||||
padding-left:10px;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
-webkit-box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
-moz-box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------
|
|
||||||
- Toolbox - Next Button -
|
|
||||||
--------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #toolbox #next {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:5px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/nextprev_invert.png);
|
|
||||||
background-position:top left;
|
|
||||||
width:28px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------
|
|
||||||
- Toolbox - Prev Button -
|
|
||||||
--------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #toolbox #previous {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:15px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/nextprev_invert.png);
|
|
||||||
background-position:top right;
|
|
||||||
width:28px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------------------------------------------
|
|
||||||
- Toolbox - divider between buttons -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #toolbox #mini_divider {
|
|
||||||
margin-top:5px;
|
|
||||||
margin-left:10px;
|
|
||||||
margin-right:10px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/toolbar_separator_2.png);
|
|
||||||
width:2px;
|
|
||||||
height:28px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-----------------------------------------
|
|
||||||
- Toolbox - Mini Thumbnail Buttons -
|
|
||||||
-------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #toolbox .mini_thumbnail_buttons {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:2px;
|
|
||||||
margin-right:2px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/buttons_invert.png);
|
|
||||||
background-position:top left;
|
|
||||||
width:22px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Before / After the Drag Button -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #drag {
|
|
||||||
position:absolute;
|
|
||||||
background-image:url(../images/navigation/drag_h_black.png);
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
background-position:left top;
|
|
||||||
height:20px;
|
|
||||||
top:80%;
|
|
||||||
width:42px;
|
|
||||||
z-index:500;
|
|
||||||
cursor:pointer;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Before / After the Divider LINE -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider_2 #divider{
|
|
||||||
position:absolute;
|
|
||||||
height:1000px;
|
|
||||||
z-index:202;
|
|
||||||
top:0px;
|
|
||||||
border-left:2px #000 solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*#####################
|
|
||||||
- VERSION III.
|
|
||||||
#####################*/
|
|
||||||
|
|
||||||
/*---------------------------------------
|
|
||||||
- CLEARING THE DEFAULT SETTINGS -
|
|
||||||
-----------------------------------------*/
|
|
||||||
.beforeafter_slider_3 ul, li {
|
|
||||||
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------------
|
|
||||||
- Centered Banner, with 10px White Border -
|
|
||||||
---------------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 {
|
|
||||||
|
|
||||||
|
|
||||||
display:none;
|
|
||||||
padding-left:30px;
|
|
||||||
padding-right:30px;
|
|
||||||
padding-top:30px;
|
|
||||||
padding-bottom:30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------------------------------
|
|
||||||
- Rounded Mask on Images -
|
|
||||||
--------------------------------*/
|
|
||||||
.beforeafter_slider_3 #mask {
|
|
||||||
position:absolute;
|
|
||||||
-webkit-border-radius:0px;
|
|
||||||
-moz-border-radius: 0px;
|
|
||||||
border-radius: 0px;
|
|
||||||
top: 1px;
|
|
||||||
left: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------
|
|
||||||
- Standard Font for Each Slide -
|
|
||||||
- Rounded Border -
|
|
||||||
---------------------------------*/
|
|
||||||
.beforeafter_slider_3 {
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
color: #000;
|
|
||||||
background-color:#1f2120;
|
|
||||||
-webkit-border-radius:0px;
|
|
||||||
-moz-border-radius: 0px;
|
|
||||||
border-radius: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------------------
|
|
||||||
- The Loader Size, Source and position on the Banner
|
|
||||||
----------------------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 .loader{
|
|
||||||
background-image:url(../images/loader/loader_round_blue.gif);
|
|
||||||
background-repeat:none;
|
|
||||||
width:18px;
|
|
||||||
height:18px;
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
top:45%;
|
|
||||||
z-index:1000;
|
|
||||||
position:relative;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/*--------------------------------------------
|
|
||||||
- The Logo in the right top Corner -
|
|
||||||
----------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #bannerlogo {
|
|
||||||
position:absolute;
|
|
||||||
left:765px;
|
|
||||||
top:5px;
|
|
||||||
z-index:1500;
|
|
||||||
cursor:point;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.beforeafter_slider_3 #bannerlogo img{
|
|
||||||
border-style:none;
|
|
||||||
border:none;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*----------------------------------------------------------------
|
|
||||||
- Image Thumbnails, borders, Marings, rounded corners -
|
|
||||||
------------------------------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #image_thumbnail{
|
|
||||||
width:96px;
|
|
||||||
height:50px;
|
|
||||||
position:absolute;
|
|
||||||
background-color:#bbb7ac;
|
|
||||||
margin-left:-35px;
|
|
||||||
margin-top:39px;
|
|
||||||
-webkit-border-radius:3px;
|
|
||||||
-moz-border-radius: 3px;
|
|
||||||
border-radius: 3px;
|
|
||||||
-webkit-box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
-moz-box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
box-shadow: 0px 0px 4px 0px #1f2120;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*---------------------------------------------------
|
|
||||||
- Small Arrow under the Image Thumbnails -
|
|
||||||
background-image:url(../images/navigation/arrow_down_white.png);
|
|
||||||
-----------------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #image_thumbnail_arrow{
|
|
||||||
width:9px;
|
|
||||||
height:5px;
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
position:absolute;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Toolbox (thumbnail, next,prev holder)
|
|
||||||
---------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #toolbox {
|
|
||||||
/*display:none;*/
|
|
||||||
background-color:#1f2120;
|
|
||||||
width:300px;
|
|
||||||
height:40px;
|
|
||||||
position:relative;
|
|
||||||
top:0px;
|
|
||||||
float:left;
|
|
||||||
margin-right:0px;
|
|
||||||
padding-left:10px;
|
|
||||||
-webkit-border-radius:0px;
|
|
||||||
-moz-border-radius: 0px;
|
|
||||||
border-radius: 0px;
|
|
||||||
-webkit-box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
-moz-box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
box-shadow: 0px 0px 6px 0px #1f2120;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------
|
|
||||||
- Toolbox - Next Button -
|
|
||||||
--------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #toolbox #next {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:5px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/nextprev.png);
|
|
||||||
background-position:top left;
|
|
||||||
width:28px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------
|
|
||||||
- Toolbox - Prev Button -
|
|
||||||
--------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #toolbox #previous {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:15px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/nextprev.png);
|
|
||||||
background-position:top right;
|
|
||||||
width:28px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*------------------------------------------
|
|
||||||
- Toolbox - divider between buttons -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #toolbox #mini_divider {
|
|
||||||
margin-top:5px;
|
|
||||||
margin-left:10px;
|
|
||||||
margin-right:10px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/toolbar_separator.png);
|
|
||||||
width:2px;
|
|
||||||
height:28px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-----------------------------------------
|
|
||||||
- Toolbox - Mini Thumbnail Buttons -
|
|
||||||
-------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #toolbox .mini_thumbnail_buttons {
|
|
||||||
margin-top:8px;
|
|
||||||
margin-left:2px;
|
|
||||||
margin-right:2px;
|
|
||||||
float:right;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/buttons.png);
|
|
||||||
background-position:top left;
|
|
||||||
width:22px;
|
|
||||||
height:22px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Before / After the Drag Button -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #drag {
|
|
||||||
position:absolute;
|
|
||||||
background-image:url(../images/navigation/drag_h_white.png);
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
background-position:left top;
|
|
||||||
top:50%;
|
|
||||||
height:20px;
|
|
||||||
width:42px;
|
|
||||||
z-index:500;
|
|
||||||
cursor:pointer;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*-------------------------------------------
|
|
||||||
- Before / After the Divider LINE -
|
|
||||||
--------------------------------------------*/
|
|
||||||
.beforeafter_slider_3 #divider{
|
|
||||||
position:absolute;
|
|
||||||
height:1000px;
|
|
||||||
z-index:202;
|
|
||||||
top:0px;
|
|
||||||
border-left:2px #fff solid;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
5786
10.大屏音乐/css/bootstrap.css
vendored
5786
10.大屏音乐/css/bootstrap.css
vendored
File diff suppressed because it is too large
Load Diff
2337
10.大屏音乐/css/font-awesome.css
vendored
2337
10.大屏音乐/css/font-awesome.css
vendored
File diff suppressed because it is too large
Load Diff
4
10.大屏音乐/css/font-awesome.min.css
vendored
4
10.大屏音乐/css/font-awesome.min.css
vendored
File diff suppressed because one or more lines are too long
@ -1,526 +0,0 @@
|
|||||||
@font-face {
|
|
||||||
font-family: 'Simple-Line-Icons';
|
|
||||||
src:url('../fonts/Simple-Line-Icons.eot');
|
|
||||||
src:url('../fonts/Simple-Line-Icons.eot?#iefix') format('embedded-opentype'),
|
|
||||||
url('../fonts/Simple-Line-Icons.woff') format('woff'),
|
|
||||||
url('../fonts/Simple-Line-Icons.ttf') format('truetype'),
|
|
||||||
url('../fonts/Simple-Line-Icons.svg#Simple-Line-Icons') format('svg');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Use the following CSS code if you want to use data attributes for inserting your icons */
|
|
||||||
[data-icon]:before {
|
|
||||||
font-family: 'Simple-Line-Icons';
|
|
||||||
content: attr(data-icon);
|
|
||||||
speak: none;
|
|
||||||
font-weight: normal;
|
|
||||||
font-variant: normal;
|
|
||||||
text-transform: none;
|
|
||||||
line-height: 1;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Use the following CSS code if you want to have a class per icon */
|
|
||||||
/*
|
|
||||||
Instead of a list of all class selectors,
|
|
||||||
you can use the generic selector below, but it's slower:
|
|
||||||
[class*="icon-"] {
|
|
||||||
*/
|
|
||||||
.icon-user-female, .icon-user-follow, .icon-user-following, .icon-user-unfollow, .icon-trophy, .icon-screen-smartphone, .icon-screen-desktop, .icon-plane, .icon-notebook, .icon-moustache, .icon-mouse, .icon-magnet, .icon-energy, .icon-emoticon-smile, .icon-disc, .icon-cursor-move, .icon-crop, .icon-credit-card, .icon-chemistry, .icon-user, .icon-speedometer, .icon-social-youtube, .icon-social-twitter, .icon-social-tumblr, .icon-social-facebook, .icon-social-dropbox, .icon-social-dribbble, .icon-shield, .icon-screen-tablet, .icon-magic-wand, .icon-hourglass, .icon-graduation, .icon-ghost, .icon-game-controller, .icon-fire, .icon-eyeglasses, .icon-envelope-open, .icon-envelope-letter, .icon-bell, .icon-badge, .icon-anchor, .icon-wallet, .icon-vector, .icon-speech, .icon-puzzle, .icon-printer, .icon-present, .icon-playlist, .icon-pin, .icon-picture, .icon-map, .icon-layers, .icon-handbag, .icon-globe-alt, .icon-globe, .icon-frame, .icon-folder-alt, .icon-film, .icon-feed, .icon-earphones-alt, .icon-earphones, .icon-drop, .icon-drawer, .icon-docs, .icon-directions, .icon-direction, .icon-diamond, .icon-cup, .icon-compass, .icon-call-out, .icon-call-in, .icon-call-end, .icon-calculator, .icon-bubbles, .icon-briefcase, .icon-book-open, .icon-basket-loaded, .icon-basket, .icon-bag, .icon-action-undo, .icon-action-redo, .icon-wrench, .icon-umbrella, .icon-trash, .icon-tag, .icon-support, .icon-size-fullscreen, .icon-size-actual, .icon-shuffle, .icon-share-alt, .icon-share, .icon-rocket, .icon-question, .icon-pie-chart, .icon-pencil, .icon-note, .icon-music-tone-alt, .icon-music-tone, .icon-microphone, .icon-loop, .icon-logout, .icon-login, .icon-list, .icon-like, .icon-home, .icon-grid, .icon-graph, .icon-equalizer, .icon-dislike, .icon-cursor, .icon-control-start, .icon-control-rewind, .icon-control-play, .icon-control-pause, .icon-control-forward, .icon-control-end, .icon-calendar, .icon-bulb, .icon-bar-chart, .icon-arrow-up, .icon-arrow-right, .icon-arrow-left, .icon-arrow-down, .icon-ban, .icon-bubble, .icon-camcorder, .icon-camera, .icon-check, .icon-clock, .icon-close, .icon-cloud-download, .icon-cloud-upload, .icon-doc, .icon-envelope, .icon-eye, .icon-flag, .icon-folder, .icon-heart, .icon-info, .icon-key, .icon-link, .icon-lock, .icon-lock-open, .icon-magnifier, .icon-magnifier-add, .icon-magnifier-remove, .icon-paper-clip, .icon-paper-plane, .icon-plus, .icon-pointer, .icon-power, .icon-refresh, .icon-reload, .icon-settings, .icon-star, .icon-symbol-female, .icon-symbol-male, .icon-target, .icon-volume-1, .icon-volume-2, .icon-volume-off, .icon-users {
|
|
||||||
font-family: 'Simple-Line-Icons';
|
|
||||||
speak: none;
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: normal;
|
|
||||||
font-variant: normal;
|
|
||||||
text-transform: none;
|
|
||||||
line-height: 1;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
.icon-user-female:before {
|
|
||||||
content: "\e000";
|
|
||||||
}
|
|
||||||
.icon-user-follow:before {
|
|
||||||
content: "\e002";
|
|
||||||
}
|
|
||||||
.icon-user-following:before {
|
|
||||||
content: "\e003";
|
|
||||||
}
|
|
||||||
.icon-user-unfollow:before {
|
|
||||||
content: "\e004";
|
|
||||||
}
|
|
||||||
.icon-trophy:before {
|
|
||||||
content: "\e006";
|
|
||||||
}
|
|
||||||
.icon-screen-smartphone:before {
|
|
||||||
content: "\e010";
|
|
||||||
}
|
|
||||||
.icon-screen-desktop:before {
|
|
||||||
content: "\e011";
|
|
||||||
}
|
|
||||||
.icon-plane:before {
|
|
||||||
content: "\e012";
|
|
||||||
}
|
|
||||||
.icon-notebook:before {
|
|
||||||
content: "\e013";
|
|
||||||
}
|
|
||||||
.icon-moustache:before {
|
|
||||||
content: "\e014";
|
|
||||||
}
|
|
||||||
.icon-mouse:before {
|
|
||||||
content: "\e015";
|
|
||||||
}
|
|
||||||
.icon-magnet:before {
|
|
||||||
content: "\e016";
|
|
||||||
}
|
|
||||||
.icon-energy:before {
|
|
||||||
content: "\e020";
|
|
||||||
}
|
|
||||||
.icon-emoticon-smile:before {
|
|
||||||
content: "\e021";
|
|
||||||
}
|
|
||||||
.icon-disc:before {
|
|
||||||
content: "\e022";
|
|
||||||
}
|
|
||||||
.icon-cursor-move:before {
|
|
||||||
content: "\e023";
|
|
||||||
}
|
|
||||||
.icon-crop:before {
|
|
||||||
content: "\e024";
|
|
||||||
}
|
|
||||||
.icon-credit-card:before {
|
|
||||||
content: "\e025";
|
|
||||||
}
|
|
||||||
.icon-chemistry:before {
|
|
||||||
content: "\e026";
|
|
||||||
}
|
|
||||||
.icon-user:before {
|
|
||||||
content: "\e005";
|
|
||||||
}
|
|
||||||
.icon-speedometer:before {
|
|
||||||
content: "\e007";
|
|
||||||
}
|
|
||||||
.icon-social-youtube:before {
|
|
||||||
content: "\e008";
|
|
||||||
}
|
|
||||||
.icon-social-twitter:before {
|
|
||||||
content: "\e009";
|
|
||||||
}
|
|
||||||
.icon-social-tumblr:before {
|
|
||||||
content: "\e00a";
|
|
||||||
}
|
|
||||||
.icon-social-facebook:before {
|
|
||||||
content: "\e00b";
|
|
||||||
}
|
|
||||||
.icon-social-dropbox:before {
|
|
||||||
content: "\e00c";
|
|
||||||
}
|
|
||||||
.icon-social-dribbble:before {
|
|
||||||
content: "\e00d";
|
|
||||||
}
|
|
||||||
.icon-shield:before {
|
|
||||||
content: "\e00e";
|
|
||||||
}
|
|
||||||
.icon-screen-tablet:before {
|
|
||||||
content: "\e00f";
|
|
||||||
}
|
|
||||||
.icon-magic-wand:before {
|
|
||||||
content: "\e017";
|
|
||||||
}
|
|
||||||
.icon-hourglass:before {
|
|
||||||
content: "\e018";
|
|
||||||
}
|
|
||||||
.icon-graduation:before {
|
|
||||||
content: "\e019";
|
|
||||||
}
|
|
||||||
.icon-ghost:before {
|
|
||||||
content: "\e01a";
|
|
||||||
}
|
|
||||||
.icon-game-controller:before {
|
|
||||||
content: "\e01b";
|
|
||||||
}
|
|
||||||
.icon-fire:before {
|
|
||||||
content: "\e01c";
|
|
||||||
}
|
|
||||||
.icon-eyeglasses:before {
|
|
||||||
content: "\e01d";
|
|
||||||
}
|
|
||||||
.icon-envelope-open:before {
|
|
||||||
content: "\e01e";
|
|
||||||
}
|
|
||||||
.icon-envelope-letter:before {
|
|
||||||
content: "\e01f";
|
|
||||||
}
|
|
||||||
.icon-bell:before {
|
|
||||||
content: "\e027";
|
|
||||||
}
|
|
||||||
.icon-badge:before {
|
|
||||||
content: "\e028";
|
|
||||||
}
|
|
||||||
.icon-anchor:before {
|
|
||||||
content: "\e029";
|
|
||||||
}
|
|
||||||
.icon-wallet:before {
|
|
||||||
content: "\e02a";
|
|
||||||
}
|
|
||||||
.icon-vector:before {
|
|
||||||
content: "\e02b";
|
|
||||||
}
|
|
||||||
.icon-speech:before {
|
|
||||||
content: "\e02c";
|
|
||||||
}
|
|
||||||
.icon-puzzle:before {
|
|
||||||
content: "\e02d";
|
|
||||||
}
|
|
||||||
.icon-printer:before {
|
|
||||||
content: "\e02e";
|
|
||||||
}
|
|
||||||
.icon-present:before {
|
|
||||||
content: "\e02f";
|
|
||||||
}
|
|
||||||
.icon-playlist:before {
|
|
||||||
content: "\e030";
|
|
||||||
}
|
|
||||||
.icon-pin:before {
|
|
||||||
content: "\e031";
|
|
||||||
}
|
|
||||||
.icon-picture:before {
|
|
||||||
content: "\e032";
|
|
||||||
}
|
|
||||||
.icon-map:before {
|
|
||||||
content: "\e033";
|
|
||||||
}
|
|
||||||
.icon-layers:before {
|
|
||||||
content: "\e034";
|
|
||||||
}
|
|
||||||
.icon-handbag:before {
|
|
||||||
content: "\e035";
|
|
||||||
}
|
|
||||||
.icon-globe-alt:before {
|
|
||||||
content: "\e036";
|
|
||||||
}
|
|
||||||
.icon-globe:before {
|
|
||||||
content: "\e037";
|
|
||||||
}
|
|
||||||
.icon-frame:before {
|
|
||||||
content: "\e038";
|
|
||||||
}
|
|
||||||
.icon-folder-alt:before {
|
|
||||||
content: "\e039";
|
|
||||||
}
|
|
||||||
.icon-film:before {
|
|
||||||
content: "\e03a";
|
|
||||||
}
|
|
||||||
.icon-feed:before {
|
|
||||||
content: "\e03b";
|
|
||||||
}
|
|
||||||
.icon-earphones-alt:before {
|
|
||||||
content: "\e03c";
|
|
||||||
}
|
|
||||||
.icon-earphones:before {
|
|
||||||
content: "\e03d";
|
|
||||||
}
|
|
||||||
.icon-drop:before {
|
|
||||||
content: "\e03e";
|
|
||||||
}
|
|
||||||
.icon-drawer:before {
|
|
||||||
content: "\e03f";
|
|
||||||
}
|
|
||||||
.icon-docs:before {
|
|
||||||
content: "\e040";
|
|
||||||
}
|
|
||||||
.icon-directions:before {
|
|
||||||
content: "\e041";
|
|
||||||
}
|
|
||||||
.icon-direction:before {
|
|
||||||
content: "\e042";
|
|
||||||
}
|
|
||||||
.icon-diamond:before {
|
|
||||||
content: "\e043";
|
|
||||||
}
|
|
||||||
.icon-cup:before {
|
|
||||||
content: "\e044";
|
|
||||||
}
|
|
||||||
.icon-compass:before {
|
|
||||||
content: "\e045";
|
|
||||||
}
|
|
||||||
.icon-call-out:before {
|
|
||||||
content: "\e046";
|
|
||||||
}
|
|
||||||
.icon-call-in:before {
|
|
||||||
content: "\e047";
|
|
||||||
}
|
|
||||||
.icon-call-end:before {
|
|
||||||
content: "\e048";
|
|
||||||
}
|
|
||||||
.icon-calculator:before {
|
|
||||||
content: "\e049";
|
|
||||||
}
|
|
||||||
.icon-bubbles:before {
|
|
||||||
content: "\e04a";
|
|
||||||
}
|
|
||||||
.icon-briefcase:before {
|
|
||||||
content: "\e04b";
|
|
||||||
}
|
|
||||||
.icon-book-open:before {
|
|
||||||
content: "\e04c";
|
|
||||||
}
|
|
||||||
.icon-basket-loaded:before {
|
|
||||||
content: "\e04d";
|
|
||||||
}
|
|
||||||
.icon-basket:before {
|
|
||||||
content: "\e04e";
|
|
||||||
}
|
|
||||||
.icon-bag:before {
|
|
||||||
content: "\e04f";
|
|
||||||
}
|
|
||||||
.icon-action-undo:before {
|
|
||||||
content: "\e050";
|
|
||||||
}
|
|
||||||
.icon-action-redo:before {
|
|
||||||
content: "\e051";
|
|
||||||
}
|
|
||||||
.icon-wrench:before {
|
|
||||||
content: "\e052";
|
|
||||||
}
|
|
||||||
.icon-umbrella:before {
|
|
||||||
content: "\e053";
|
|
||||||
}
|
|
||||||
.icon-trash:before {
|
|
||||||
content: "\e054";
|
|
||||||
}
|
|
||||||
.icon-tag:before {
|
|
||||||
content: "\e055";
|
|
||||||
}
|
|
||||||
.icon-support:before {
|
|
||||||
content: "\e056";
|
|
||||||
}
|
|
||||||
.icon-size-fullscreen:before {
|
|
||||||
content: "\e057";
|
|
||||||
}
|
|
||||||
.icon-size-actual:before {
|
|
||||||
content: "\e058";
|
|
||||||
}
|
|
||||||
.icon-shuffle:before {
|
|
||||||
content: "\e059";
|
|
||||||
}
|
|
||||||
.icon-share-alt:before {
|
|
||||||
content: "\e05a";
|
|
||||||
}
|
|
||||||
.icon-share:before {
|
|
||||||
content: "\e05b";
|
|
||||||
}
|
|
||||||
.icon-rocket:before {
|
|
||||||
content: "\e05c";
|
|
||||||
}
|
|
||||||
.icon-question:before {
|
|
||||||
content: "\e05d";
|
|
||||||
}
|
|
||||||
.icon-pie-chart:before {
|
|
||||||
content: "\e05e";
|
|
||||||
}
|
|
||||||
.icon-pencil:before {
|
|
||||||
content: "\e05f";
|
|
||||||
}
|
|
||||||
.icon-note:before {
|
|
||||||
content: "\e060";
|
|
||||||
}
|
|
||||||
.icon-music-tone-alt:before {
|
|
||||||
content: "\e061";
|
|
||||||
}
|
|
||||||
.icon-music-tone:before {
|
|
||||||
content: "\e062";
|
|
||||||
}
|
|
||||||
.icon-microphone:before {
|
|
||||||
content: "\e063";
|
|
||||||
}
|
|
||||||
.icon-loop:before {
|
|
||||||
content: "\e064";
|
|
||||||
}
|
|
||||||
.icon-logout:before {
|
|
||||||
content: "\e065";
|
|
||||||
}
|
|
||||||
.icon-login:before {
|
|
||||||
content: "\e066";
|
|
||||||
}
|
|
||||||
.icon-list:before {
|
|
||||||
content: "\e067";
|
|
||||||
}
|
|
||||||
.icon-like:before {
|
|
||||||
content: "\e068";
|
|
||||||
}
|
|
||||||
.icon-home:before {
|
|
||||||
content: "\e069";
|
|
||||||
}
|
|
||||||
.icon-grid:before {
|
|
||||||
content: "\e06a";
|
|
||||||
}
|
|
||||||
.icon-graph:before {
|
|
||||||
content: "\e06b";
|
|
||||||
}
|
|
||||||
.icon-equalizer:before {
|
|
||||||
content: "\e06c";
|
|
||||||
}
|
|
||||||
.icon-dislike:before {
|
|
||||||
content: "\e06d";
|
|
||||||
}
|
|
||||||
.icon-cursor:before {
|
|
||||||
content: "\e06e";
|
|
||||||
}
|
|
||||||
.icon-control-start:before {
|
|
||||||
content: "\e06f";
|
|
||||||
}
|
|
||||||
.icon-control-rewind:before {
|
|
||||||
content: "\e070";
|
|
||||||
}
|
|
||||||
.icon-control-play:before {
|
|
||||||
content: "\e071";
|
|
||||||
}
|
|
||||||
.icon-control-pause:before {
|
|
||||||
content: "\e072";
|
|
||||||
}
|
|
||||||
.icon-control-forward:before {
|
|
||||||
content: "\e073";
|
|
||||||
}
|
|
||||||
.icon-control-end:before {
|
|
||||||
content: "\e074";
|
|
||||||
}
|
|
||||||
.icon-calendar:before {
|
|
||||||
content: "\e075";
|
|
||||||
}
|
|
||||||
.icon-bulb:before {
|
|
||||||
content: "\e076";
|
|
||||||
}
|
|
||||||
.icon-bar-chart:before {
|
|
||||||
content: "\e077";
|
|
||||||
}
|
|
||||||
.icon-arrow-up:before {
|
|
||||||
content: "\e078";
|
|
||||||
}
|
|
||||||
.icon-arrow-right:before {
|
|
||||||
content: "\e079";
|
|
||||||
}
|
|
||||||
.icon-arrow-left:before {
|
|
||||||
content: "\e07a";
|
|
||||||
}
|
|
||||||
.icon-arrow-down:before {
|
|
||||||
content: "\e07b";
|
|
||||||
}
|
|
||||||
.icon-ban:before {
|
|
||||||
content: "\e07c";
|
|
||||||
}
|
|
||||||
.icon-bubble:before {
|
|
||||||
content: "\e07d";
|
|
||||||
}
|
|
||||||
.icon-camcorder:before {
|
|
||||||
content: "\e07e";
|
|
||||||
}
|
|
||||||
.icon-camera:before {
|
|
||||||
content: "\e07f";
|
|
||||||
}
|
|
||||||
.icon-check:before {
|
|
||||||
content: "\e080";
|
|
||||||
}
|
|
||||||
.icon-clock:before {
|
|
||||||
content: "\e081";
|
|
||||||
}
|
|
||||||
.icon-close:before {
|
|
||||||
content: "\e082";
|
|
||||||
}
|
|
||||||
.icon-cloud-download:before {
|
|
||||||
content: "\e083";
|
|
||||||
}
|
|
||||||
.icon-cloud-upload:before {
|
|
||||||
content: "\e084";
|
|
||||||
}
|
|
||||||
.icon-doc:before {
|
|
||||||
content: "\e085";
|
|
||||||
}
|
|
||||||
.icon-envelope:before {
|
|
||||||
content: "\e086";
|
|
||||||
}
|
|
||||||
.icon-eye:before {
|
|
||||||
content: "\e087";
|
|
||||||
}
|
|
||||||
.icon-flag:before {
|
|
||||||
content: "\e088";
|
|
||||||
}
|
|
||||||
.icon-folder:before {
|
|
||||||
content: "\e089";
|
|
||||||
}
|
|
||||||
.icon-heart:before {
|
|
||||||
content: "\e08a";
|
|
||||||
}
|
|
||||||
.icon-info:before {
|
|
||||||
content: "\e08b";
|
|
||||||
}
|
|
||||||
.icon-key:before {
|
|
||||||
content: "\e08c";
|
|
||||||
}
|
|
||||||
.icon-link:before {
|
|
||||||
content: "\e08d";
|
|
||||||
}
|
|
||||||
.icon-lock:before {
|
|
||||||
content: "\e08e";
|
|
||||||
}
|
|
||||||
.icon-lock-open:before {
|
|
||||||
content: "\e08f";
|
|
||||||
}
|
|
||||||
.icon-magnifier:before {
|
|
||||||
content: "\e090";
|
|
||||||
}
|
|
||||||
.icon-magnifier-add:before {
|
|
||||||
content: "\e091";
|
|
||||||
}
|
|
||||||
.icon-magnifier-remove:before {
|
|
||||||
content: "\e092";
|
|
||||||
}
|
|
||||||
.icon-paper-clip:before {
|
|
||||||
content: "\e093";
|
|
||||||
}
|
|
||||||
.icon-paper-plane:before {
|
|
||||||
content: "\e094";
|
|
||||||
}
|
|
||||||
.icon-plus:before {
|
|
||||||
content: "\e095";
|
|
||||||
}
|
|
||||||
.icon-pointer:before {
|
|
||||||
content: "\e096";
|
|
||||||
}
|
|
||||||
.icon-power:before {
|
|
||||||
content: "\e097";
|
|
||||||
}
|
|
||||||
.icon-refresh:before {
|
|
||||||
content: "\e098";
|
|
||||||
}
|
|
||||||
.icon-reload:before {
|
|
||||||
content: "\e099";
|
|
||||||
}
|
|
||||||
.icon-settings:before {
|
|
||||||
content: "\e09a";
|
|
||||||
}
|
|
||||||
.icon-star:before {
|
|
||||||
content: "\e09b";
|
|
||||||
}
|
|
||||||
.icon-symbol-female:before {
|
|
||||||
content: "\e09c";
|
|
||||||
}
|
|
||||||
.icon-symbol-male:before {
|
|
||||||
content: "\e09d";
|
|
||||||
}
|
|
||||||
.icon-target:before {
|
|
||||||
content: "\e09e";
|
|
||||||
}
|
|
||||||
.icon-volume-1:before {
|
|
||||||
content: "\e09f";
|
|
||||||
}
|
|
||||||
.icon-volume-2:before {
|
|
||||||
content: "\e0a0";
|
|
||||||
}
|
|
||||||
.icon-volume-off:before {
|
|
||||||
content: "\e0a1";
|
|
||||||
}
|
|
||||||
.icon-users:before {
|
|
||||||
content: "\e001";
|
|
||||||
}
|
|
||||||
@ -1,426 +0,0 @@
|
|||||||
/*-----------------------------------------------------------------------------
|
|
||||||
|
|
||||||
Before-After and Backstage
|
|
||||||
|
|
||||||
Screen Stylesheet
|
|
||||||
|
|
||||||
version: 1.0
|
|
||||||
date: 07/27/11
|
|
||||||
author: freshline
|
|
||||||
email: support@version-four.com
|
|
||||||
website: http://www.version-four.com
|
|
||||||
-----------------------------------------------------------------------------*/
|
|
||||||
|
|
||||||
/***********/
|
|
||||||
/* BASICS */
|
|
||||||
/*********/
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Source Sans Pro';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 300;
|
|
||||||
src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url('../fonts/sourcesanspro/sourcesanspro-light.woff') format('woff');
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Source Sans Pro';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url('../fonts/sourcesanspro/sourcesanspro.woff') format('woff');
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Source Sans Pro';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 700;
|
|
||||||
src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('../fonts/sourcesanspro/sourcesanspro-bold.woff') format('woff');
|
|
||||||
}
|
|
||||||
@font-face {
|
|
||||||
font-family: 'Oswald';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
src: local('Oswald Regular'), local('Oswald-Regular'), url(../fonts/lanrentuku.woff) format('woff');
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*************************/
|
|
||||||
/* BODY STYLE */
|
|
||||||
/***********************/
|
|
||||||
body {
|
|
||||||
background-color:#A6B8CC;
|
|
||||||
}
|
|
||||||
.titlelogo {
|
|
||||||
background-image:url(../images/sitelogo.png);
|
|
||||||
background-repeat:no-repeat;
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
padding-top:35px;
|
|
||||||
margin-top:20px;
|
|
||||||
margin-bottom:-5px;
|
|
||||||
display:block;
|
|
||||||
width:250px;
|
|
||||||
height:98px;
|
|
||||||
}
|
|
||||||
#big_divider {
|
|
||||||
margin-top:40px;
|
|
||||||
}
|
|
||||||
#demo-content {
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
margin-left:auto;
|
|
||||||
margin-right:auto;
|
|
||||||
width:900px;
|
|
||||||
background-color:#fff;
|
|
||||||
-webkit-box-shadow: 0px -15px 35px -30px;
|
|
||||||
-moz-box-shadow: 0px -15px 35px -30px;
|
|
||||||
box-shadow: 0px -15px 35px -30px;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#demo-content .smallinfo {
|
|
||||||
position:relative;
|
|
||||||
z-index:10;
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
float:right;
|
|
||||||
font-size:12px;
|
|
||||||
margin-right:30px;
|
|
||||||
margin-top:10px;
|
|
||||||
display:block;
|
|
||||||
}
|
|
||||||
|
|
||||||
#demo-content .smalldeclaration {
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
float:left;
|
|
||||||
font-size:12px;
|
|
||||||
margin-left:12px;
|
|
||||||
margin-top:10px;
|
|
||||||
display:block;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#demo-content .float_title {
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
color:#fff;
|
|
||||||
font-weight:normal;
|
|
||||||
font-size:14px;
|
|
||||||
margin-top:88px;
|
|
||||||
margin-left:30px;
|
|
||||||
margin-right:30px;
|
|
||||||
padding-top:5px;
|
|
||||||
padding-bottom:5px;
|
|
||||||
padding-left:10px;
|
|
||||||
background-color:#1f2120;
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
|
|
||||||
#demo-content #demo-settings {
|
|
||||||
position:absolute;
|
|
||||||
color:#A6B8CC;
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
font-size:18px;
|
|
||||||
background: #1f2120 url(../images/navigation/settingsanim_1.gif) no-repeat 16px 5px;
|
|
||||||
-webkit-box-shadow: 0px 0px 6px 0px #797a79;
|
|
||||||
-moz-box-shadow: 0px 0px 6px 0px #797a79;
|
|
||||||
box-shadow: 0px 0px 6px 0px #797a79;
|
|
||||||
padding-left:68px;
|
|
||||||
padding-right:10px;
|
|
||||||
padding-top:5px;
|
|
||||||
padding-bottom:5px;
|
|
||||||
margin-top:10px;
|
|
||||||
margin-left:30px;
|
|
||||||
width:126px;
|
|
||||||
height:28px;
|
|
||||||
z-index:10;
|
|
||||||
cursor:pointer;
|
|
||||||
border-top-right-radius: 10px;
|
|
||||||
-moz-border-radius-topright: 10px;
|
|
||||||
-webkit-border-top-right-radius: 10px;
|
|
||||||
border-bottom-right-radius: 10px;
|
|
||||||
-moz-border-radius-bottomright: 10px;
|
|
||||||
-webkit-border-bottom-right-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#demo-content #panel {
|
|
||||||
opacity:0.0;
|
|
||||||
position:absolute;
|
|
||||||
width:204px;
|
|
||||||
height:0px;
|
|
||||||
margin-top:0px;
|
|
||||||
margin-left:30px;
|
|
||||||
background-color:#fff;
|
|
||||||
float:left;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
z-index:5;
|
|
||||||
-webkit-box-shadow: 0px 0px 4px 0px #797a79;
|
|
||||||
-moz-box-shadow: 0px 0px 4px 0px #797a79;
|
|
||||||
box-shadow: 0px 0px 4px 0px #797a79;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
#demo-content #panel li{
|
|
||||||
width:18px;
|
|
||||||
height:18px;
|
|
||||||
float:left;
|
|
||||||
margin-left:12px;
|
|
||||||
margin-right:0px;
|
|
||||||
margin-top:7px;
|
|
||||||
border:1px solid #a6b8cc;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
#demo-content #panel ul, li {
|
|
||||||
margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
|
|
||||||
-webkit-user-select: none;
|
|
||||||
-khtml-user-select: none;
|
|
||||||
-moz-user-select: none;
|
|
||||||
-o-user-select: none;
|
|
||||||
user-select: none;
|
|
||||||
list-style-type: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg1{
|
|
||||||
background-color:#a6b8cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg2{
|
|
||||||
background:url(../images/background/pattern/royal_line/royal_wall.jpg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg3{
|
|
||||||
background:url(../images/background/pattern/royal_line/royal_green.jpg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg4{
|
|
||||||
background:url(../images/background/pattern/damask/royal_dark.jpg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg5{
|
|
||||||
background:url(../images/background/textures/w_07.jpg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.bg6{
|
|
||||||
background:url(../images/background/abstract/g_09.jpg);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.border1{
|
|
||||||
background-color:#000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.border2{
|
|
||||||
background:url(../images/background/pattern/basic/pattern_1b.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
.border3{
|
|
||||||
background:url(../images/background/pattern/damask/simple_med.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
.border4{
|
|
||||||
background:url(../images/background/pattern/basic/pattern_02b.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
.border5{
|
|
||||||
background:url(../images/background/pattern/basic/pattern_10.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
.border6{
|
|
||||||
background:url(../images/background/pattern/damask/simple_grey.png);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.borderstyleselector {
|
|
||||||
color:#A6B8CC;
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
font-size:12px;
|
|
||||||
margin-top:10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.rounded{
|
|
||||||
float:left;
|
|
||||||
|
|
||||||
color:#1f2120;
|
|
||||||
}
|
|
||||||
.square{
|
|
||||||
float:left;
|
|
||||||
margin-right:10px;
|
|
||||||
|
|
||||||
}
|
|
||||||
.photo{
|
|
||||||
float:left;
|
|
||||||
margin-right:0px;
|
|
||||||
margin-left:5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.normal{
|
|
||||||
float:left;
|
|
||||||
margin-right:10px;
|
|
||||||
color:#1f2120;
|
|
||||||
}
|
|
||||||
|
|
||||||
.seperator{
|
|
||||||
float:left;
|
|
||||||
margin-left:5px;
|
|
||||||
margin-right:5px;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
#rounded:hover {
|
|
||||||
cursor:pointer;
|
|
||||||
color:#1f2120;
|
|
||||||
}
|
|
||||||
#square:hover {
|
|
||||||
cursor:pointer;
|
|
||||||
color:#1f2120;
|
|
||||||
}
|
|
||||||
|
|
||||||
#photo:hover {
|
|
||||||
cursor:pointer;
|
|
||||||
color:#1f2120;
|
|
||||||
}
|
|
||||||
|
|
||||||
#normal:hover {
|
|
||||||
cursor:pointer;
|
|
||||||
color:#1f2120;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.shadowselector {
|
|
||||||
color:#A6B8CC;
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
font-size:12px;
|
|
||||||
margin-top:5px;
|
|
||||||
margin-left:5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#shadow1 {cursor:pointer;float:left;margin-left:7px}
|
|
||||||
#shadow2 {cursor:pointer;float:left;margin-left:0px}
|
|
||||||
#shadow3 {cursor:pointer;float:left;margin-left:0px}
|
|
||||||
|
|
||||||
|
|
||||||
#demo-content #grey_head{
|
|
||||||
position:absolute;
|
|
||||||
top:0;
|
|
||||||
left:0;
|
|
||||||
background-color:#e8e8e8;
|
|
||||||
height:58px;
|
|
||||||
width:100%;
|
|
||||||
border-top-right-radius: 10px;
|
|
||||||
-moz-border-radius-topright: 10px;
|
|
||||||
-webkit-border-top-right-radius: 10px;
|
|
||||||
border-top-left-radius: 10px;
|
|
||||||
-moz-border-radius-toprleft: 10px;
|
|
||||||
-webkit-border-top-left-radius: 10px;
|
|
||||||
}
|
|
||||||
#demo-content #demo-toolbox {
|
|
||||||
position:relative;
|
|
||||||
z-index:10;
|
|
||||||
background-color:#1f2120;
|
|
||||||
width:auto;
|
|
||||||
float:right;
|
|
||||||
margin-right:30px;
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
padding-left:10px;
|
|
||||||
padding-right:10px;
|
|
||||||
padding-top:5px;
|
|
||||||
padding-bottom:5px;
|
|
||||||
-webkit-border-radius:10px;
|
|
||||||
-moz-border-radius: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
-webkit-box-shadow: 0px 0px 6px 0px #797a79;
|
|
||||||
-moz-box-shadow: 0px 0px 6px 0px #797a79;
|
|
||||||
box-shadow: 0px 0px 6px 0px #797a79;
|
|
||||||
}
|
|
||||||
#demo-content #demo-toolbox .button {
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
color:#A6B8CC;
|
|
||||||
font-size:18px;
|
|
||||||
float:left;
|
|
||||||
margin-left:10px;
|
|
||||||
margin-right:10px;
|
|
||||||
margin-top:0px;
|
|
||||||
cursor:pointer;
|
|
||||||
}
|
|
||||||
#demo-content #demo-toolbox .button:hover {
|
|
||||||
color:#fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
#demo-content #demo-toolbox #divider {
|
|
||||||
margin-left:10px;
|
|
||||||
margin-right:10px;
|
|
||||||
float:left;
|
|
||||||
overflow:hidden;
|
|
||||||
background-image:url(../images/navigation/toolbar_separator.png);
|
|
||||||
width:2px;
|
|
||||||
height:28px;
|
|
||||||
}
|
|
||||||
#demo-content #sourcecode-headline{
|
|
||||||
color:#000;
|
|
||||||
font-family: 'Oswald', sans-serif;
|
|
||||||
font-size:16px;
|
|
||||||
clear:both;
|
|
||||||
margin:30px;
|
|
||||||
}
|
|
||||||
#demo-content #sourcecode{
|
|
||||||
color:#333;
|
|
||||||
background-color:#f2f8ff;
|
|
||||||
border:1px solid #b4b8bd;
|
|
||||||
border-style:dotted;
|
|
||||||
margin-left:30px;
|
|
||||||
margin-right:30px;
|
|
||||||
};
|
|
||||||
|
|
||||||
.gray-background{
|
|
||||||
background-color: #ccc;
|
|
||||||
height:40px;
|
|
||||||
width:100px;
|
|
||||||
position:absolute;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#demo-content hr{
|
|
||||||
border-top:0;
|
|
||||||
border-left:0;
|
|
||||||
border-right:0;
|
|
||||||
border-bottom:1px dotted #b4b8bd;
|
|
||||||
height: 0;
|
|
||||||
margin-top:40px;
|
|
||||||
margin-left:30px;
|
|
||||||
margin-right:30px;
|
|
||||||
margin-bottom:20px;
|
|
||||||
}
|
|
||||||
#demo-content #infobox{
|
|
||||||
margin-left:30px;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
#demo-content #infobox #left_info,#demo-content #infobox #right_info{
|
|
||||||
float:left;
|
|
||||||
padding-top:15px;
|
|
||||||
height:38px;
|
|
||||||
vertical-align:middle;
|
|
||||||
color:#A6B8CC;
|
|
||||||
font-size:14px;
|
|
||||||
margin-bottom:30px;
|
|
||||||
}
|
|
||||||
#demo-content #infobox #left_info{
|
|
||||||
padding-left:60px;
|
|
||||||
background:#fff url(../images/icon_1.png) no-repeat;
|
|
||||||
border-right:1px dotted #b4b8bd;
|
|
||||||
width:360px;
|
|
||||||
}
|
|
||||||
#demo-content #infobox #right_info{
|
|
||||||
padding-left:55px;
|
|
||||||
background:#fff url(../images/icon_2.png) no-repeat;
|
|
||||||
margin-left: 30px;
|
|
||||||
}
|
|
||||||
Binary file not shown.
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 178 KiB |
Binary file not shown.
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 175 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 434 KiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 116 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 220 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 122 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 131 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 175 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 114 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 122 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 68 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 122 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 70 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 68 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 90 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 75 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 81 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 76 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 44 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 95 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 98 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 212 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 181 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 235 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 65 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 19 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 66 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 104 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 72 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 50 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 172 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 79 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 40 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 559 B |
Binary file not shown.
|
Before Width: | Height: | Size: 559 B |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 131 B |
Binary file not shown.
|
Before Width: | Height: | Size: 146 B |
Binary file not shown.
|
Before Width: | Height: | Size: 68 KiB |
@ -1,375 +0,0 @@
|
|||||||
/*! http://mths.be/placeholder v2.0.7 by @mathias */
|
|
||||||
;(function(h,j,e){var a="placeholder" in j.createElement("input");var f="placeholder" in j.createElement("textarea");var k=e.fn;var d=e.valHooks;var b=e.propHooks;var m;var l;if(a&&f){l=k.placeholder=function(){return this};l.input=l.textarea=true}else{l=k.placeholder=function(){var n=this;n.filter((a?"textarea":":input")+"[placeholder]").not(".placeholder").bind({"focus.placeholder":c,"blur.placeholder":g}).data("placeholder-enabled",true).trigger("blur.placeholder");return n};l.input=a;l.textarea=f;m={get:function(o){var n=e(o);var p=n.data("placeholder-password");if(p){return p[0].value}return n.data("placeholder-enabled")&&n.hasClass("placeholder")?"":o.value},set:function(o,q){var n=e(o);var p=n.data("placeholder-password");if(p){return p[0].value=q}if(!n.data("placeholder-enabled")){return o.value=q}if(q==""){o.value=q;if(o!=j.activeElement){g.call(o)}}else{if(n.hasClass("placeholder")){c.call(o,true,q)||(o.value=q)}else{o.value=q}}return n}};if(!a){d.input=m;b.value=m}if(!f){d.textarea=m;b.value=m}e(function(){e(j).delegate("form","submit.placeholder",function(){var n=e(".placeholder",this).each(c);setTimeout(function(){n.each(g)},10)})});e(h).bind("beforeunload.placeholder",function(){e(".placeholder").each(function(){this.value=""})})}function i(o){var n={};var p=/^jQuery\d+$/;e.each(o.attributes,function(r,q){if(q.specified&&!p.test(q.name)){n[q.name]=q.value}});return n}function c(o,p){var n=this;var q=e(n);if(n.value==q.attr("placeholder")&&q.hasClass("placeholder")){if(q.data("placeholder-password")){q=q.hide().next().show().attr("id",q.removeAttr("id").data("placeholder-id"));if(o===true){return q[0].value=p}q.focus()}else{n.value="";q.removeClass("placeholder");n==j.activeElement&&n.select()}}}function g(){var r;var n=this;var q=e(n);var p=this.id;if(n.value==""){if(n.type=="password"){if(!q.data("placeholder-textinput")){try{r=q.clone().attr({type:"text"})}catch(o){r=e("<input>").attr(e.extend(i(this),{type:"text"}))}r.removeAttr("name").data({"placeholder-password":q,"placeholder-id":p}).bind("focus.placeholder",c);q.data({"placeholder-textinput":r,"placeholder-id":p}).before(r)}q=q.removeAttr("id").hide().prev().attr("id",p).show()}q.addClass("placeholder");q[0].value=q.attr("placeholder")}else{q.removeClass("placeholder")}}}(this,document,jQuery));
|
|
||||||
|
|
||||||
/* Modernizr 2.6.2 (Custom Build) | MIT & BSD
|
|
||||||
* Build: http://modernizr.com/download/#-touch-cssclasses-teststyles-prefixes
|
|
||||||
*/
|
|
||||||
;window.Modernizr=function(a,b,c){function w(a){j.cssText=a}function x(a,b){return w(m.join(a+";")+(b||""))}function y(a,b){return typeof a===b}function z(a,b){return!!~(""+a).indexOf(b)}function A(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:y(f,"function")?f.bind(d||b):f}return!1}var d="2.6.2",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m=" -webkit- -moz- -o- -ms- ".split(" "),n={},o={},p={},q=[],r=q.slice,s,t=function(a,c,d,e){var f,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["­",'<style id="s',h,'">',a,"</style>"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!i},u={}.hasOwnProperty,v;!y(u,"undefined")&&!y(u.call,"undefined")?v=function(a,b){return u.call(a,b)}:v=function(a,b){return b in a&&y(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=r.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(r.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(r.call(arguments)))};return e}),n.touch=function(){var c;return"ontouchstart"in a||a.DocumentTouch&&b instanceof DocumentTouch?c=!0:t(["@media (",m.join("touch-enabled),("),h,")","{#modernizr{top:9px;position:absolute}}"].join(""),function(a){c=a.offsetTop===9}),c};for(var B in n)v(n,B)&&(s=B.toLowerCase(),e[s]=n[B](),q.push((e[s]?"":"no-")+s));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)v(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},w(""),i=k=null,e._version=d,e._prefixes=m,e.testStyles=t,g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+q.join(" "):""),e}(this,this.document);
|
|
||||||
Modernizr.addTest('android',function(){return!!navigator.userAgent.match(/Android/i)});
|
|
||||||
Modernizr.addTest('chrome',function(){return!!navigator.userAgent.match(/Chrome/i)});
|
|
||||||
Modernizr.addTest('firefox',function(){return!!navigator.userAgent.match(/Firefox/i)});
|
|
||||||
Modernizr.addTest('iemobile',function(){return!!navigator.userAgent.match(/IEMobile/i)});
|
|
||||||
Modernizr.addTest('ie',function(){return!!navigator.userAgent.match(/MSIE/i)});
|
|
||||||
Modernizr.addTest('ie8',function(){return!!navigator.userAgent.match(/MSIE 8/i)});
|
|
||||||
Modernizr.addTest('ie10',function(){return!!navigator.userAgent.match(/MSIE 10/i)});
|
|
||||||
Modernizr.addTest('ie11',function(){return!!navigator.userAgent.match(/Trident.*rv:11\./)});
|
|
||||||
Modernizr.addTest('ios',function(){return!!navigator.userAgent.match(/iPhone|iPad|iPod/i)});
|
|
||||||
Modernizr.addTest('ios7 ipad',function(){return!!navigator.userAgent.match(/iPad;.*CPU.*OS 7_\d/i)});
|
|
||||||
/*!
|
|
||||||
* screenfull
|
|
||||||
* v1.0.4 - 2013-05-26
|
|
||||||
* https://github.com/sindresorhus/screenfull.js
|
|
||||||
* (c) Sindre Sorhus; MIT License
|
|
||||||
*/
|
|
||||||
(function(a,b){"use strict";var c="undefined"!=typeof Element&&"ALLOW_KEYBOARD_INPUT"in Element,d=function(){for(var a,c,d=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"]],e=0,f=d.length,g={};f>e;e++)if(a=d[e],a&&a[1]in b){for(e=0,c=a.length;c>e;e++)g[d[0][e]]=a[e];return g}return!1}(),e={request:function(a){var e=d.requestFullscreen;a=a||b.documentElement,/5\.1[\.\d]* Safari/.test(navigator.userAgent)?a[e]():a[e](c&&Element.ALLOW_KEYBOARD_INPUT)},exit:function(){b[d.exitFullscreen]()},toggle:function(a){this.isFullscreen?this.exit():this.request(a)},onchange:function(){},onerror:function(){},raw:d};return d?(Object.defineProperties(e,{isFullscreen:{get:function(){return!!b[d.fullscreenElement]}},element:{enumerable:!0,get:function(){return b[d.fullscreenElement]}},enabled:{enumerable:!0,get:function(){return!!b[d.fullscreenEnabled]}}}),b.addEventListener(d.fullscreenchange,function(a){e.onchange.call(e,a)}),b.addEventListener(d.fullscreenerror,function(a){e.onerror.call(e,a)}),a.screenfull=e,void 0):a.screenfull=!1})(window,document);
|
|
||||||
|
|
||||||
|
|
||||||
// data-shift api
|
|
||||||
+function ($) { "use strict";
|
|
||||||
|
|
||||||
/* SHIFT CLASS DEFINITION
|
|
||||||
* ====================== */
|
|
||||||
|
|
||||||
var Shift = function (element) {
|
|
||||||
this.$element = $(element)
|
|
||||||
this.$prev = this.$element.prev()
|
|
||||||
!this.$prev.length && (this.$parent = this.$element.parent())
|
|
||||||
}
|
|
||||||
|
|
||||||
Shift.prototype = {
|
|
||||||
constructor: Shift
|
|
||||||
|
|
||||||
, init:function(){
|
|
||||||
var $el = this.$element
|
|
||||||
, method = $el.data()['toggle'].split(':')[1]
|
|
||||||
, $target = $el.data('target')
|
|
||||||
$el.hasClass('in') || $el[method]($target).addClass('in')
|
|
||||||
}
|
|
||||||
, reset :function(){
|
|
||||||
this.$parent && this.$parent['prepend'](this.$element)
|
|
||||||
!this.$parent && this.$element['insertAfter'](this.$prev)
|
|
||||||
this.$element.removeClass('in')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* SHIFT PLUGIN DEFINITION
|
|
||||||
* ======================= */
|
|
||||||
|
|
||||||
$.fn.shift = function (option) {
|
|
||||||
return this.each(function () {
|
|
||||||
var $this = $(this)
|
|
||||||
, data = $this.data('shift')
|
|
||||||
if (!data) $this.data('shift', (data = new Shift(this)))
|
|
||||||
if (typeof option == 'string') data[option]()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
$.fn.shift.Constructor = Shift
|
|
||||||
}(jQuery);
|
|
||||||
|
|
||||||
|
|
||||||
// data-bjax api
|
|
||||||
+function ($) { "use strict";
|
|
||||||
var Bjax = function (element, options) {
|
|
||||||
this.options = options
|
|
||||||
this.$element = $( this.options.target || 'html' );
|
|
||||||
this.start()
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.DEFAULTS = {
|
|
||||||
backdrop: true
|
|
||||||
, url: ''
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.prototype.start = function () {
|
|
||||||
var that = this;
|
|
||||||
this.backdrop();
|
|
||||||
$.ajax(this.options.url).done(function(r){
|
|
||||||
that.$content = r;
|
|
||||||
that.complete();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.prototype.complete = function (){
|
|
||||||
var that = this;
|
|
||||||
if( this.$element.is('html') || (this.options.replace) ){
|
|
||||||
try{
|
|
||||||
window.history.pushState({}, '', this.options.url);
|
|
||||||
}catch(e){
|
|
||||||
window.location.replace(this.options.url)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
this.updateBar(100);
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.prototype.backdrop = function(){
|
|
||||||
this.$element.css('position','relative')
|
|
||||||
this.$backdrop = $('<div class="backdrop fade bg-white"></div>')
|
|
||||||
.appendTo(this.$element);
|
|
||||||
if(!this.options.backdrop) this.$backdrop.css('height', '2');
|
|
||||||
this.$backdrop[0].offsetWidth; // force reflow
|
|
||||||
this.$backdrop.addClass('in');
|
|
||||||
|
|
||||||
this.$bar = $('<div class="bar b-t b-2x b-info"></div>')
|
|
||||||
.width(0)
|
|
||||||
.appendTo(this.$backdrop);
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.prototype.update = function (){
|
|
||||||
this.$element.css('position','');
|
|
||||||
if( !this.$element.is('html') ){
|
|
||||||
if(this.options.el){
|
|
||||||
this.$content = $(this.$content).find(this.options.el);
|
|
||||||
}
|
|
||||||
this.$element.html(this.$content);
|
|
||||||
}
|
|
||||||
if( this.$element.is('html') ) {
|
|
||||||
if( $('.ie').length ){
|
|
||||||
location.reload();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
document.open();
|
|
||||||
document.write(this.$content);
|
|
||||||
document.close();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.prototype.updateBar = function (per){
|
|
||||||
var that = this;
|
|
||||||
this.$bar.stop().animate({
|
|
||||||
width: per + '%'
|
|
||||||
}, 500, 'linear', function(){
|
|
||||||
if(per == 100) that.update();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
Bjax.prototype.enable = function (e){
|
|
||||||
var link = e.currentTarget;
|
|
||||||
if ( location.protocol !== link.protocol || location.hostname !== link.hostname )
|
|
||||||
return false
|
|
||||||
if (link.hash && link.href.replace(link.hash, '') ===
|
|
||||||
location.href.replace(location.hash, ''))
|
|
||||||
return false
|
|
||||||
if (link.href === location.href + '#' || link.href === location.href)
|
|
||||||
return false
|
|
||||||
if(link.protocol.indexOf('http') ==-1)
|
|
||||||
return false
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
$.fn.bjax = function (option) {
|
|
||||||
return this.each(function () {
|
|
||||||
var $this = $(this);
|
|
||||||
var data = $this.data('app.bjax');
|
|
||||||
var options = $.extend({}, Bjax.DEFAULTS, $this.data(), typeof option == 'object' && option)
|
|
||||||
if (!data) $this.data('app.bjax', (data = new Bjax(this, options)))
|
|
||||||
if (data) data['start']()
|
|
||||||
if (typeof option == 'string') data[option]()
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
$.fn.bjax.Constructor = Bjax
|
|
||||||
|
|
||||||
$(window).on("popstate", function(e) {
|
|
||||||
if (e.originalEvent.state !== null) {
|
|
||||||
window.location.reload(true);
|
|
||||||
}
|
|
||||||
e.preventDefault();
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on('click.app.bjax.data-api', '[data-bjax], .nav-primary a', function (e) {
|
|
||||||
if(!Bjax.prototype.enable(e)) return;
|
|
||||||
$(this).bjax({url: $(this).attr('href') || $(this).attr('data-url') });
|
|
||||||
e.preventDefault();
|
|
||||||
})
|
|
||||||
}(jQuery);
|
|
||||||
|
|
||||||
Date.now = Date.now || function() { return +new Date; };
|
|
||||||
|
|
||||||
+function ($) {
|
|
||||||
|
|
||||||
$(function(){
|
|
||||||
|
|
||||||
// toogle fullscreen
|
|
||||||
$(document).on('click', "[data-toggle=fullscreen]", function(e){
|
|
||||||
e.preventDefault();
|
|
||||||
if (screenfull.enabled) {
|
|
||||||
screenfull.request();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// placeholder
|
|
||||||
$('input[placeholder], textarea[placeholder]').placeholder();
|
|
||||||
|
|
||||||
// popover
|
|
||||||
$("[data-toggle=popover]").popover();
|
|
||||||
$(document).on('click', '.popover-title .close', function(e){
|
|
||||||
var $target = $(e.target), $popover = $target.closest('.popover').prev();
|
|
||||||
$popover && $popover.popover('hide');
|
|
||||||
});
|
|
||||||
|
|
||||||
// ajax modal
|
|
||||||
$(document).on('click', '[data-toggle="ajaxModal"]',
|
|
||||||
function(e) {
|
|
||||||
$('#ajaxModal').remove();
|
|
||||||
e.preventDefault();
|
|
||||||
var $this = $(this)
|
|
||||||
, $remote = $this.data('remote') || $this.attr('href')
|
|
||||||
, $modal = $('<div class="modal fade" id="ajaxModal"><div class="modal-body"></div></div>');
|
|
||||||
$('body').append($modal);
|
|
||||||
$modal.modal();
|
|
||||||
$modal.load($remote);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
// dropdown menu
|
|
||||||
$.fn.dropdown.Constructor.prototype.change = function(e){
|
|
||||||
e.preventDefault();
|
|
||||||
var $item = $(e.target), $select, $checked = false, $menu, $label;
|
|
||||||
!$item.is('a') && ($item = $item.closest('a'));
|
|
||||||
$menu = $item.closest('.dropdown-menu');
|
|
||||||
$label = $menu.parent().find('.dropdown-label');
|
|
||||||
$labelHolder = $label.text();
|
|
||||||
$select = $item.parent().find('input');
|
|
||||||
$checked = $select.is(':checked');
|
|
||||||
if($select.is(':disabled')) return;
|
|
||||||
if($select.attr('type') == 'radio' && $checked) return;
|
|
||||||
if($select.attr('type') == 'radio') $menu.find('li').removeClass('active');
|
|
||||||
$item.parent().removeClass('active');
|
|
||||||
!$checked && $item.parent().addClass('active');
|
|
||||||
$select.prop("checked", !$select.prop("checked"));
|
|
||||||
|
|
||||||
$items = $menu.find('li > input:checked');
|
|
||||||
if ($items.length) {
|
|
||||||
$text = [];
|
|
||||||
$items.each(function () {
|
|
||||||
var $str = $(this).parent().text();
|
|
||||||
$str && $text.push($.trim($str));
|
|
||||||
});
|
|
||||||
|
|
||||||
$text = $text.length < 4 ? $text.join(', ') : $text.length + ' selected';
|
|
||||||
$label.html($text);
|
|
||||||
}else{
|
|
||||||
$label.html($label.data('placeholder'));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
$(document).on('click.dropdown-menu', '.dropdown-select > li > a', $.fn.dropdown.Constructor.prototype.change);
|
|
||||||
|
|
||||||
// tooltip
|
|
||||||
$("[data-toggle=tooltip]").tooltip();
|
|
||||||
|
|
||||||
// class
|
|
||||||
$(document).on('click', '[data-toggle^="class"]', function(e){
|
|
||||||
e && e.preventDefault();
|
|
||||||
var $this = $(e.target), $class , $target, $tmp, $classes, $targets;
|
|
||||||
!$this.data('toggle') && ($this = $this.closest('[data-toggle^="class"]'));
|
|
||||||
$class = $this.data()['toggle'];
|
|
||||||
$target = $this.data('target') || $this.attr('href');
|
|
||||||
$class && ($tmp = $class.split(':')[1]) && ($classes = $tmp.split(','));
|
|
||||||
$target && ($targets = $target.split(','));
|
|
||||||
$classes && $classes.length && $.each($targets, function( index, value ) {
|
|
||||||
if ( $classes[index].indexOf( '*' ) !== -1 ) {
|
|
||||||
var patt = new RegExp( '\\s' +
|
|
||||||
$classes[index].
|
|
||||||
replace( /\*/g, '[A-Za-z0-9-_]+' ).
|
|
||||||
split( ' ' ).
|
|
||||||
join( '\\s|\\s' ) +
|
|
||||||
'\\s', 'g' );
|
|
||||||
$($this).each( function ( i, it ) {
|
|
||||||
var cn = ' ' + it.className + ' ';
|
|
||||||
while ( patt.test( cn ) ) {
|
|
||||||
cn = cn.replace( patt, ' ' );
|
|
||||||
}
|
|
||||||
it.className = $.trim( cn );
|
|
||||||
});
|
|
||||||
}
|
|
||||||
($targets[index] !='#') && $($targets[index]).toggleClass($classes[index]) || $this.toggleClass($classes[index]);
|
|
||||||
});
|
|
||||||
$this.toggleClass('active');
|
|
||||||
});
|
|
||||||
|
|
||||||
// panel toggle
|
|
||||||
$(document).on('click', '.panel-toggle', function(e){
|
|
||||||
e && e.preventDefault();
|
|
||||||
var $this = $(e.target), $class = 'collapse' , $target;
|
|
||||||
if (!$this.is('a')) $this = $this.closest('a');
|
|
||||||
$target = $this.closest('.panel');
|
|
||||||
$target.find('.panel-body').toggleClass($class);
|
|
||||||
$this.toggleClass('active');
|
|
||||||
});
|
|
||||||
|
|
||||||
// carousel
|
|
||||||
$('.carousel.auto').carousel();
|
|
||||||
|
|
||||||
// button loading
|
|
||||||
$(document).on('click.button.data-api', '[data-loading-text]', function (e) {
|
|
||||||
var $this = $(e.target);
|
|
||||||
$this.is('i') && ($this = $this.parent());
|
|
||||||
$this.button('loading');
|
|
||||||
});
|
|
||||||
|
|
||||||
var $window = $(window);
|
|
||||||
// mobile
|
|
||||||
var mobile = function(option){
|
|
||||||
if(option == 'reset'){
|
|
||||||
$('[data-toggle^="shift"]').shift('reset');
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
$('[data-toggle^="shift"]').shift('init');
|
|
||||||
return true;
|
|
||||||
};
|
|
||||||
// unmobile
|
|
||||||
$window.width() < 768 && mobile();
|
|
||||||
// resize
|
|
||||||
var $resize, $width = $window.width();
|
|
||||||
$window.resize(function() {
|
|
||||||
if($width !== $window.width()){
|
|
||||||
clearTimeout($resize);
|
|
||||||
$resize = setTimeout(function(){
|
|
||||||
setHeight();
|
|
||||||
$window.width() < 768 && mobile();
|
|
||||||
$window.width() >= 768 && mobile('reset') && fixVbox();
|
|
||||||
$width = $window.width();
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// fluid layout
|
|
||||||
var setHeight = function(){
|
|
||||||
$('.app-fluid #nav > *').css('min-height', $(window).height()-60);
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
setHeight();
|
|
||||||
|
|
||||||
|
|
||||||
// fix vbox
|
|
||||||
var fixVbox = function(){
|
|
||||||
$('.ie11 .vbox').each(function(){
|
|
||||||
$(this).height($(this).parent().height());
|
|
||||||
});
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
fixVbox();
|
|
||||||
|
|
||||||
// collapse nav
|
|
||||||
$(document).on('click', '[data-ride="collapse"] a', function (e) {
|
|
||||||
var $this = $(e.target), $active;
|
|
||||||
$this.is('a') || ($this = $this.closest('a'));
|
|
||||||
|
|
||||||
$active = $this.parent().siblings( ".active" );
|
|
||||||
$active && $active.toggleClass('active').find('> ul:visible').slideUp(200);
|
|
||||||
|
|
||||||
($this.parent().hasClass('active') && $this.next().slideUp(200)) || $this.next().slideDown(200);
|
|
||||||
$this.parent().toggleClass('active');
|
|
||||||
|
|
||||||
$this.next().is('ul') && e.preventDefault();
|
|
||||||
|
|
||||||
setTimeout(function(){ $(document).trigger('updateNav'); }, 300);
|
|
||||||
});
|
|
||||||
|
|
||||||
// dropdown still
|
|
||||||
$(document).on('click.bs.dropdown.data-api', '.dropdown .on, .dropup .on, .open .on', function (e) { e.stopPropagation() });
|
|
||||||
|
|
||||||
});
|
|
||||||
}(jQuery);
|
|
||||||
@ -1,166 +0,0 @@
|
|||||||
+function ($) { "use strict";
|
|
||||||
|
|
||||||
$(function(){
|
|
||||||
|
|
||||||
// sparkline
|
|
||||||
var sr, sparkline = function($re){
|
|
||||||
$(".sparkline").each(function(){
|
|
||||||
var $data = $(this).data();
|
|
||||||
if($re && !$data.resize) return;
|
|
||||||
($data.type == 'pie') && $data.sliceColors && ($data.sliceColors = eval($data.sliceColors));
|
|
||||||
($data.type == 'bar') && $data.stackedBarColor && ($data.stackedBarColor = eval($data.stackedBarColor));
|
|
||||||
$data.valueSpots = {'0:': $data.spotColor};
|
|
||||||
$(this).sparkline('html', $data);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
$(window).resize(function(e) {
|
|
||||||
clearTimeout(sr);
|
|
||||||
sr = setTimeout(function(){sparkline(true)}, 500);
|
|
||||||
});
|
|
||||||
sparkline(false);
|
|
||||||
|
|
||||||
// easypie
|
|
||||||
var easypie = function(){
|
|
||||||
$('.easypiechart').each(function(){
|
|
||||||
var $this = $(this),
|
|
||||||
$data = $this.data(),
|
|
||||||
$step = $this.find('.step'),
|
|
||||||
$target_value = parseInt($($data.target).text()),
|
|
||||||
$value = 0;
|
|
||||||
$data.barColor || ( $data.barColor = function($percent) {
|
|
||||||
$percent /= 100;
|
|
||||||
return "rgb(" + Math.round(200 * $percent) + ", 200, " + Math.round(200 * (1 - $percent)) + ")";
|
|
||||||
});
|
|
||||||
$data.onStep = function(value){
|
|
||||||
$value = value;
|
|
||||||
$step.text(parseInt(value));
|
|
||||||
$data.target && $($data.target).text(parseInt(value) + $target_value);
|
|
||||||
}
|
|
||||||
$data.onStop = function(){
|
|
||||||
$target_value = parseInt($($data.target).text());
|
|
||||||
$data.update && setTimeout(function() {
|
|
||||||
$this.data('easyPieChart').update(100 - $value);
|
|
||||||
}, $data.update);
|
|
||||||
}
|
|
||||||
$(this).easyPieChart($data);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
easypie();
|
|
||||||
|
|
||||||
// datepicker
|
|
||||||
$(".datepicker-input").each(function(){ $(this).datepicker();});
|
|
||||||
|
|
||||||
// dropfile
|
|
||||||
$('.dropfile').each(function(){
|
|
||||||
var $dropbox = $(this);
|
|
||||||
if (typeof window.FileReader === 'undefined') {
|
|
||||||
$('small',this).html('File API & FileReader API not supported').addClass('text-danger');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.ondragover = function () {$dropbox.addClass('hover'); return false; };
|
|
||||||
this.ondragend = function () {$dropbox.removeClass('hover'); return false; };
|
|
||||||
this.ondrop = function (e) {
|
|
||||||
e.preventDefault();
|
|
||||||
$dropbox.removeClass('hover').html('');
|
|
||||||
var file = e.dataTransfer.files[0],
|
|
||||||
reader = new FileReader();
|
|
||||||
reader.onload = function (event) {
|
|
||||||
$dropbox.append($('<img>').attr('src', event.target.result));
|
|
||||||
};
|
|
||||||
reader.readAsDataURL(file);
|
|
||||||
return false;
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
// slider
|
|
||||||
$('.slider').each(function(){
|
|
||||||
$(this).slider();
|
|
||||||
});
|
|
||||||
|
|
||||||
// sortable
|
|
||||||
if ($.fn.sortable) {
|
|
||||||
$('.sortable').sortable();
|
|
||||||
}
|
|
||||||
|
|
||||||
// slim-scroll
|
|
||||||
$('.no-touch .slim-scroll').each(function(){
|
|
||||||
var $self = $(this), $data = $self.data(), $slimResize;
|
|
||||||
$self.slimScroll($data);
|
|
||||||
$(window).resize(function(e) {
|
|
||||||
clearTimeout($slimResize);
|
|
||||||
$slimResize = setTimeout(function(){$self.slimScroll($data);}, 500);
|
|
||||||
});
|
|
||||||
$(document).on('updateNav', function(){
|
|
||||||
$self.slimScroll($data);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// portlet
|
|
||||||
$('.portlet').each(function(){
|
|
||||||
$(".portlet").sortable({
|
|
||||||
connectWith: '.portlet',
|
|
||||||
iframeFix: false,
|
|
||||||
items: '.portlet-item',
|
|
||||||
opacity: 0.8,
|
|
||||||
helper: 'original',
|
|
||||||
revert: true,
|
|
||||||
forceHelperSize: true,
|
|
||||||
placeholder: 'sortable-box-placeholder round-all',
|
|
||||||
forcePlaceholderSize: true,
|
|
||||||
tolerance: 'pointer'
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// docs
|
|
||||||
$('#docs pre code').each(function(){
|
|
||||||
var $this = $(this);
|
|
||||||
var t = $this.html();
|
|
||||||
$this.html(t.replace(/</g, '<').replace(/>/g, '>'));
|
|
||||||
});
|
|
||||||
|
|
||||||
// table select/deselect all
|
|
||||||
$(document).on('change', 'table thead [type="checkbox"]', function(e){
|
|
||||||
e && e.preventDefault();
|
|
||||||
var $table = $(e.target).closest('table'), $checked = $(e.target).is(':checked');
|
|
||||||
$('tbody [type="checkbox"]',$table).prop('checked', $checked);
|
|
||||||
});
|
|
||||||
|
|
||||||
// random progress
|
|
||||||
$(document).on('click', '[data-toggle^="progress"]', function(e){
|
|
||||||
e && e.preventDefault();
|
|
||||||
|
|
||||||
var $el = $(e.target),
|
|
||||||
$target = $($el.data('target'));
|
|
||||||
$('.progress', $target).each(
|
|
||||||
function(){
|
|
||||||
var $max = 50, $data, $ps = $('.progress-bar',this).last();
|
|
||||||
($(this).hasClass('progress-xs') || $(this).hasClass('progress-sm')) && ($max = 100);
|
|
||||||
$data = Math.floor(Math.random()*$max)+'%';
|
|
||||||
$ps.css('width', $data).attr('data-original-title', $data);
|
|
||||||
}
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
// add notes
|
|
||||||
function addMsg($msg){
|
|
||||||
var $el = $('.nav-user'), $n = $('.count:first', $el), $v = parseInt($n.text());
|
|
||||||
$('.count', $el).fadeOut().fadeIn().text($v+1);
|
|
||||||
$($msg).hide().prependTo($el.find('.list-group')).slideDown().css('display','block');
|
|
||||||
}
|
|
||||||
var $msg = '<a href="#" class="media list-group-item">'+
|
|
||||||
'<span class="pull-left thumb-sm text-center">'+
|
|
||||||
'<i class="fa fa-envelope-o fa-2x text-success"></i>'+
|
|
||||||
'</span>'+
|
|
||||||
'<span class="media-body block m-b-none">'+
|
|
||||||
'Sophi sent you a email<br>'+
|
|
||||||
'<small class="text-muted">1 minutes ago</small>'+
|
|
||||||
'</span>'+
|
|
||||||
'</a>';
|
|
||||||
setTimeout(function(){addMsg($msg);}, 1500);
|
|
||||||
|
|
||||||
//chosen
|
|
||||||
$(".chosen-select").length && $(".chosen-select").chosen();
|
|
||||||
|
|
||||||
});
|
|
||||||
}(window.jQuery);
|
|
||||||
1951
10.大屏音乐/js/bootstrap.js
vendored
1951
10.大屏音乐/js/bootstrap.js
vendored
File diff suppressed because it is too large
Load Diff
@ -1,15 +0,0 @@
|
|||||||
$(function () {
|
|
||||||
// $.noConflict();
|
|
||||||
jQuery('#example3').beforeAfter_slider(
|
|
||||||
{
|
|
||||||
left:1,
|
|
||||||
top:1,
|
|
||||||
width: 570,
|
|
||||||
height: 264,
|
|
||||||
start_from: 'left',
|
|
||||||
start_pos: 447,
|
|
||||||
follow: false,
|
|
||||||
timer: 3500
|
|
||||||
}
|
|
||||||
)
|
|
||||||
});
|
|
||||||
@ -1 +0,0 @@
|
|||||||
(function(a){a.fn.animaDrag=function(b,c){var d={speed:400,interval:300,easing:null,cursor:"point",boundary:document.body,boundary_offset:0,grip:null,offset_x:0,offset_y:0,overlay:true,direction:"vertical",dragit:null,afterDiv:null,after:function(a){},during:function(a){},before:function(a){},afterEachAnimation:function(a){}};if(typeof c=="function"){d.after=c}b=a.extend(d,b||{});return this.each(function(){var c,d,e,f,g,h=false,i,j=b.dragit,k=a(this).find(b.grip).length>0?a(this).find(b.grip):a(this);if(b.boundary){var l=0-b.boundary_offset;var m=0-b.boundary_offset;var n=l+a(b.boundary).innerHeight()+2*b.boundary_offset;var p=m+a(b.boundary).innerWidth()+2*b.boundary_offset}if(a.browser.msie&&a.browser.version>=7&&a.browser.version<9){k.mousemove(function(k){b.before.call(j,k);var l,m;h=true;i=k;d=l=k.pageX;e=m=k.pageY;var n=parseInt(b.boundary.parent().css("padding-left"));f=a(j).offset().left-b.boundary.parent().offset().left-n;g=a(j).offset().top-b.boundary.parent().position().top;a(j).onselectstart=function(){return false};a(j).css({position:"absolute",cursor:b.cursor,zIndex:"1010"});c=setInterval(function(){a(j).css({left:d-b.boundary.parent().offset().left-n+"px"});b.boundary.find("#divider").css({left:a(j).position().left+a(j).width()/2+"px"});if(b.afterDiv!=null){b.afterDiv.parent().parent().parent().find("#before").each(function(c){var d=parseInt(b.boundary.parent().css("padding-left"));var e=b.boundary.find("#divider").offset().left-b.boundary.find("#divider").parent().parent().offset().left-d;if(e<0)e=0;a(this).parent().parent().css({width:e+"px"})})}l=i.pageX;m=i.pageY},b.interval);a.browser.safari||k.preventDefault()})}k.mousedown(function(k){b.before.call(j,k);var l,n;h=true;i=k;d=l=k.pageX;e=n=k.pageY;var q=parseInt(b.boundary.parent().css("padding-left"));f=a(j).offset().left-b.boundary.parent().offset().left-q;g=a(j).offset().top-b.boundary.parent().position().top;a(j).onselectstart=function(){return false};a(j).css({position:"absolute",cursor:b.cursor,zIndex:"1010"});c=setInterval(function(){if(l!=i.pageX||n!=i.pageY){var c=f-(d-i.pageX);var h=g-(e-i.pageY);if(c<m&&b.boundary){c=m}else if(c+a(j).innerWidth()>p&&b.boundary){c=p-a(j).outerWidth()}if(b.direction=="vertical"){a(j).stop().animate({left:c+b.offset_x+"px"},b.speed,b.easing)}}b.boundary.find("#divider").css({left:a(j).position().left+a(j).width()/2+"px"});if(b.afterDiv!=null){b.afterDiv.parent().parent().parent().find("#before").each(function(c){var d=parseInt(b.boundary.parent().css("padding-left"));var e=b.boundary.find("#divider").offset().left-b.boundary.find("#divider").parent().parent().offset().left-d;if(e<0)e=0;a(this).parent().parent().css({width:e+"px"})})}l=i.pageX;n=i.pageY},b.interval);a.browser.safari||k.preventDefault()});a(document).mousemove(function(a){if(h){i=a;b.during.call(j,a)}});a(document).mouseup(function(d){if(h){a(j).css({cursor:"",zIndex:"990"}).removeClass("anima-drag");a("#anima-drag-overlay").hide().appendTo(document.body);clearInterval(c);b.after.call(j,d);h=false}})})}})(jQuery)
|
|
||||||
@ -1,750 +0,0 @@
|
|||||||
(function (a, b) {
|
|
||||||
function o(c, d) {
|
|
||||||
var e = 0;
|
|
||||||
c.find("div").each(function (b) {
|
|
||||||
var d = a(this);
|
|
||||||
if (d.hasClass("before")) d.appendTo(c.find("#before").parent());
|
|
||||||
if (d.hasClass("after")) d.appendTo(c.find("#after").parent())
|
|
||||||
});
|
|
||||||
c.find("div").each(function (f) {
|
|
||||||
c.onselectstart = function () {
|
|
||||||
return false
|
|
||||||
};
|
|
||||||
var g = a(this);
|
|
||||||
if (g.attr("id") != "ext_ext_before") g.stop(true, true);
|
|
||||||
if (g.data("_top") == b) g.data("_top", g.position().top);
|
|
||||||
if (g.data("_left") == b) g.data("_left", g.position().left);
|
|
||||||
if (g.data("_op") == b) g.data("_op", g.css("opacity"));
|
|
||||||
if (!(a.browser.msie && a.browser.version >= 7 && a.browser.version < 9)) {
|
|
||||||
if (g.hasClass("slideup")) {
|
|
||||||
g.animate({
|
|
||||||
top: g.data("_top") + 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
top: g.data("_top") - 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("slideright")) {
|
|
||||||
g.animate({
|
|
||||||
left: g.data("_left") - 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
left: g.data("_left") + 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("slidedown")) {
|
|
||||||
g.animate({
|
|
||||||
top: g.data("_top") - 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
top: g.data("_top") + 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("slideleft")) {
|
|
||||||
g.animate({
|
|
||||||
left: g.data("_left") + 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
left: g.data("_left") - 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("fadeup")) {
|
|
||||||
g.animate({
|
|
||||||
top: g.data("_top") + 20 + "px",
|
|
||||||
opacity: 0
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
top: g.data("_top") - 20 + "px",
|
|
||||||
opacity: g.data("_op")
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("faderight")) {
|
|
||||||
g.animate({
|
|
||||||
left: g.data("_left") - 20 + "px",
|
|
||||||
opacity: 0
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
left: g.data("_left") + 20 + "px",
|
|
||||||
opacity: g.data("_op")
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("fadedown")) {
|
|
||||||
g.animate({
|
|
||||||
top: g.data("_top") - 20 + "px",
|
|
||||||
opacity: 0
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
top: g.data("_top") + 20 + "px",
|
|
||||||
opacity: g.data("_op")
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("fadeleft")) {
|
|
||||||
g.animate({
|
|
||||||
left: g.data("_left") + 20 + "px",
|
|
||||||
opacity: 0
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
left: g.data("_left") - 20 + "px",
|
|
||||||
opacity: g.data("_op")
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
if (g.hasClass("fade")) {
|
|
||||||
g.animate({
|
|
||||||
opacity: 0
|
|
||||||
}, {
|
|
||||||
duration: 0,
|
|
||||||
queue: false
|
|
||||||
}).delay(d + (e + 1) * 200).animate({
|
|
||||||
opacity: g.data("_op")
|
|
||||||
}, {
|
|
||||||
duration: 300,
|
|
||||||
queue: true
|
|
||||||
});
|
|
||||||
e++
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function n(b) {
|
|
||||||
if (a.browser.msie && a.browser.version >= 7 && a.browser.version < 9) jQuery(b).animaDrag({
|
|
||||||
dragit: b.find("#drag"),
|
|
||||||
speed: 0,
|
|
||||||
interval: 0,
|
|
||||||
easing: null,
|
|
||||||
direction: "vertical",
|
|
||||||
boundary: b.find("#mask"),
|
|
||||||
boundary_offset: 30,
|
|
||||||
grip: null,
|
|
||||||
overlay: false,
|
|
||||||
afterDiv: b.data("currentSlide")
|
|
||||||
});
|
|
||||||
else jQuery(b.find("#drag")).animaDrag({
|
|
||||||
dragit: b.find("#drag"),
|
|
||||||
speed: 0,
|
|
||||||
interval: 0,
|
|
||||||
easing: null,
|
|
||||||
direction: "vertical",
|
|
||||||
boundary: b.find("#mask"),
|
|
||||||
boundary_offset: 30,
|
|
||||||
grip: null,
|
|
||||||
overlay: false,
|
|
||||||
afterDiv: b.data("currentSlide")
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function m(b, c) {
|
|
||||||
var d = b.data("dragH");
|
|
||||||
d = b.find("#drag").height() / 2;
|
|
||||||
b.each(function () {
|
|
||||||
$this = a(this);
|
|
||||||
h($this, c)
|
|
||||||
});
|
|
||||||
b.find("li").each(function (b) {
|
|
||||||
$this = a(this);
|
|
||||||
i($this, b, c)
|
|
||||||
});
|
|
||||||
b.css({
|
|
||||||
opacity: "0.0",
|
|
||||||
display: "block"
|
|
||||||
});
|
|
||||||
b.animate({
|
|
||||||
opacity: "1.0"
|
|
||||||
}, 1500);
|
|
||||||
var e = b.data("currentSlide").find("#after").parent().parent();
|
|
||||||
var f = e.find("#after").parent();
|
|
||||||
var g = f.find("#after");
|
|
||||||
var j = b.data("currentSlide").find("#before").parent().parent();
|
|
||||||
var k = j.find("#before").parent();
|
|
||||||
var l = k.find("#before");
|
|
||||||
if (c.start_from == "right") {
|
|
||||||
j.css({
|
|
||||||
width: c.width,
|
|
||||||
overflow: "hidden"
|
|
||||||
});
|
|
||||||
if (c.ie) {} else {
|
|
||||||
j.animate({
|
|
||||||
width: c.width + "px"
|
|
||||||
}, 0).delay(500)
|
|
||||||
}
|
|
||||||
b.find("#drag").animate({
|
|
||||||
left: c.width + "px"
|
|
||||||
}, 0).delay(500);
|
|
||||||
b.find("#divider").animate({
|
|
||||||
left: c.width + "px"
|
|
||||||
}, 0).delay(500)
|
|
||||||
}
|
|
||||||
if (c.start_from == "left") {
|
|
||||||
j.css({
|
|
||||||
width: "0px",
|
|
||||||
overflow: "hidden"
|
|
||||||
});
|
|
||||||
if (c.ie) {} else {
|
|
||||||
j.animate({
|
|
||||||
width: "0px",
|
|
||||||
overflow: "hidden"
|
|
||||||
}, 0).delay(500)
|
|
||||||
}
|
|
||||||
b.find("#drag").animate({
|
|
||||||
left: "0px"
|
|
||||||
}, 0).delay(500);
|
|
||||||
b.find("#divider").animate({
|
|
||||||
left: "0px"
|
|
||||||
}, 0).delay(500)
|
|
||||||
}
|
|
||||||
j.animate({
|
|
||||||
width: c.start_pos + "px"
|
|
||||||
}, 800);
|
|
||||||
b.find("#drag").animate({
|
|
||||||
opacity: .3,
|
|
||||||
left: c.start_pos - 20 + "px"
|
|
||||||
}, {
|
|
||||||
duration: 800,
|
|
||||||
complete: function () {
|
|
||||||
var e = a(this);
|
|
||||||
if (c.follow) {
|
|
||||||
var f = function (c) {
|
|
||||||
var e = a(this);
|
|
||||||
e.find("#drag").css({
|
|
||||||
opacity: "1.0"
|
|
||||||
});
|
|
||||||
e.find("#drag").css({
|
|
||||||
top: c.pageY - e.offset().top - d - b.data().off + "px"
|
|
||||||
})
|
|
||||||
};
|
|
||||||
b.bind("mousemove", f)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
b.find("#divider").animate({
|
|
||||||
opacity: .3,
|
|
||||||
left: c.start_pos + "px"
|
|
||||||
}, 800);
|
|
||||||
n(b, b.data("currentSlide"));
|
|
||||||
b.find("#toolbox").animate({
|
|
||||||
opacity: "1.0"
|
|
||||||
}, 1e3);
|
|
||||||
b.find("ul li").animate({
|
|
||||||
opacity: "1.0"
|
|
||||||
}, 300);
|
|
||||||
b.find("#mainloader").animate({
|
|
||||||
opacity: "0.4"
|
|
||||||
}, {
|
|
||||||
duration: 500,
|
|
||||||
complete: function () {
|
|
||||||
b.find("#mainloader").remove()
|
|
||||||
}
|
|
||||||
});
|
|
||||||
o(b.data("currentSlide"), 500);
|
|
||||||
b.hover(function () {
|
|
||||||
a(this).addClass("onitemhovered")
|
|
||||||
}, function () {
|
|
||||||
a(this).removeClass("onitemhovered")
|
|
||||||
});
|
|
||||||
if (c.timer > 0) {
|
|
||||||
c.countdown = 0;
|
|
||||||
setInterval(function () {
|
|
||||||
if (!b.hasClass("onitemhovered")) c.countdown = c.countdown + 1;
|
|
||||||
if (c.countdown >= c.timer / 100) {
|
|
||||||
c.countdown = 0;
|
|
||||||
b.find("#previous").click()
|
|
||||||
}
|
|
||||||
var a = 100 - Math.round(100 / c.timer * c.countdown * 100);
|
|
||||||
b.find(".thumbison .timer").css({
|
|
||||||
backgroundPosition: "0px " + a * 10 + "px"
|
|
||||||
})
|
|
||||||
}, 100)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function l(b, c) {
|
|
||||||
var d = a('<div id="toolbox" style="opacity:0"></div>');
|
|
||||||
b.append(d);
|
|
||||||
d.css({
|
|
||||||
"z-index": "405"
|
|
||||||
});
|
|
||||||
var e = a("<div id='previous'></div>");
|
|
||||||
var f = a("<div id='next'></div>");
|
|
||||||
var h = function (b) {
|
|
||||||
b.hover(function () {
|
|
||||||
var b = a(this);
|
|
||||||
if (b.attr("id") == "previous") b.css({
|
|
||||||
"background-position": "bottom right"
|
|
||||||
});
|
|
||||||
else b.css({
|
|
||||||
"background-position": "bottom left"
|
|
||||||
})
|
|
||||||
}, function () {
|
|
||||||
$this = a(this);
|
|
||||||
if ($this.attr("id") == "previous") $this.css({
|
|
||||||
"background-position": "top right"
|
|
||||||
});
|
|
||||||
else $this.css({
|
|
||||||
"background-position": "top left"
|
|
||||||
})
|
|
||||||
})
|
|
||||||
};
|
|
||||||
var i = function (d) {
|
|
||||||
d.click(function () {
|
|
||||||
var d = a(this);
|
|
||||||
var e = b.data("currentSlide").index();
|
|
||||||
if (d.attr("id") == "previous") e++;
|
|
||||||
else e--;
|
|
||||||
if (e == b.data("currentSlide").parent().find("li").size()) e = 0;
|
|
||||||
if (e == -1) e = b.data("currentSlide").parent().find("li").size() - 1;
|
|
||||||
var f = b.find("li").each(function (f) {
|
|
||||||
d = a(this);
|
|
||||||
if (f == e) {
|
|
||||||
g(b.data("currentSlide"), d, b, c)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
};
|
|
||||||
h(e);
|
|
||||||
i(e);
|
|
||||||
h(f);
|
|
||||||
i(f);
|
|
||||||
d.append(e);
|
|
||||||
d.append(f);
|
|
||||||
var j = a("<div id='mini_divider'></div>");
|
|
||||||
d.append(j);
|
|
||||||
b.find("li").each(function (e) {
|
|
||||||
var f = a(this);
|
|
||||||
var h = f.parent().find("li").size() - 1;
|
|
||||||
var i = a("<div id='" + (h - e) + "' class='mini_thumbnail_buttons'><div class='timer'></div></div>");
|
|
||||||
d.append(i);
|
|
||||||
if (b.data("currentSlide").index() == h - e) {
|
|
||||||
i.data("on", true);
|
|
||||||
i.css({
|
|
||||||
"background-position": "bottom right"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
i.hover(function () {
|
|
||||||
var d = a(this);
|
|
||||||
d.css({
|
|
||||||
"background-position": "top right"
|
|
||||||
});
|
|
||||||
if (d.data().on == true) d.css({
|
|
||||||
"background-position": "bottom right"
|
|
||||||
});
|
|
||||||
d.parent().append('<div id="image_thumbnail" style="opacity:0.0;left:' + d.position().left + "px;top:" + (d.position().top + 10) + 'px"></div>');
|
|
||||||
var e = d.parent().find("#image_thumbnail");
|
|
||||||
var f = a(this).attr("id");
|
|
||||||
var g = "";
|
|
||||||
var h = "";
|
|
||||||
b.find("li").each(function () {
|
|
||||||
var b = a(this);
|
|
||||||
if (a(this).index() == f) {
|
|
||||||
g = b.find("#before").attr("src");
|
|
||||||
h = b.find("#after").attr("src")
|
|
||||||
}
|
|
||||||
});
|
|
||||||
var i = e.width() - 6;
|
|
||||||
var j = e.height() - 6;
|
|
||||||
var k = b.find("#divider").position().left / c.width * i;
|
|
||||||
e.append('<div><div><img style="position:absolute;top:3px;left:3px;width:' + i + "px;height:" + j + 'px" src="' + h + '"></div></div>');
|
|
||||||
e.append('<div style="position:absolute;overflow:hidden;width:' + k + "px;height:" + e.height() + 'px"><div><img style="position:absolute;top:3px;left:3px;width:' + i + "px;height:" + j + 'px" src="' + g + '"></div></div>');
|
|
||||||
e.append('<div id="loader" style="loader"></div>');
|
|
||||||
e.append('<div id="image_thumbnail_arrow" style="position:absolute;left:' + (e.width() / 2 - 4) + "px;top:" + (e.height() - 1) + 'px"></div>');
|
|
||||||
e.animate({
|
|
||||||
opacity: 1,
|
|
||||||
top: +1
|
|
||||||
}, 200)
|
|
||||||
}, function () {
|
|
||||||
var b = a(this);
|
|
||||||
b.css({
|
|
||||||
"background-position": "top left"
|
|
||||||
});
|
|
||||||
if (b.data().on == true) b.css({
|
|
||||||
"background-position": "bottom left"
|
|
||||||
});
|
|
||||||
b.parent().find("#image_thumbnail").remove()
|
|
||||||
});
|
|
||||||
i.click(function () {
|
|
||||||
var d = a(this);
|
|
||||||
if (d.data().on != true) {
|
|
||||||
var e = a(this).attr("id");
|
|
||||||
var f = b.find("li").each(function (d) {
|
|
||||||
var f = a(this);
|
|
||||||
if (d == e) {
|
|
||||||
g(b.data("currentSlide"), f, b, c)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
});
|
|
||||||
b.find(".timer:last").parent().addClass("thumbison")
|
|
||||||
}
|
|
||||||
|
|
||||||
function k(b, c) {
|
|
||||||
var d = b.data().dragH;
|
|
||||||
b.each(function () {
|
|
||||||
$this = a(this);
|
|
||||||
h($this, c)
|
|
||||||
});
|
|
||||||
b.find("li").each(function (b) {
|
|
||||||
$this = a(this);
|
|
||||||
i($this, b, c)
|
|
||||||
});
|
|
||||||
b.css({
|
|
||||||
opacity: "0.0",
|
|
||||||
display: "block"
|
|
||||||
});
|
|
||||||
b.animate({
|
|
||||||
opacity: "1.0"
|
|
||||||
}, 1500);
|
|
||||||
l(b, c, b.data("currentSlide"))
|
|
||||||
}
|
|
||||||
|
|
||||||
function j(a, b) {
|
|
||||||
a.find("ul").wrap("<div id='mask'></div>");
|
|
||||||
a.find("#mask").css({
|
|
||||||
overflow: "hidden",
|
|
||||||
width: b.width + "px",
|
|
||||||
height: b.height + "px",
|
|
||||||
position: "absolute"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function i(b, c, d) {
|
|
||||||
a(b).css({
|
|
||||||
width: d.width + "px",
|
|
||||||
height: d.height + "px",
|
|
||||||
"z-index": "200",
|
|
||||||
position: "relative",
|
|
||||||
overflow: "hidden",
|
|
||||||
left: 0,
|
|
||||||
top: 0
|
|
||||||
});
|
|
||||||
if (!(a.browser.msie && a.browser.version >= 7 && a.browser.version < 9)) {
|
|
||||||
if (c > 0) a(b).css({
|
|
||||||
opacity: 0
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function h(a, b) {
|
|
||||||
a.css({
|
|
||||||
width: b.width + "px",
|
|
||||||
height: b.height + "px",
|
|
||||||
position: "relative"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function g(b, c, d, e) {
|
|
||||||
e.countdown = 0;
|
|
||||||
var f = true;
|
|
||||||
d.find("li").each(function () {
|
|
||||||
$this = a(this);
|
|
||||||
if ($this.index() != b.index() && $this.index() != c.index())
|
|
||||||
if (!(a.browser.msie && a.browser.version >= 7 && a.browser.version < 9)) {
|
|
||||||
$this.css({
|
|
||||||
opacity: 0
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
$this.css({
|
|
||||||
"z-index": "50"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
else $this.css({
|
|
||||||
"z-index": "100"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
if (b.index() > c.index()) f = false;
|
|
||||||
if (b.index() == 0 && c.index() != 1) f = false;
|
|
||||||
if (b.index() == b.parent().find("li").size() - 1 && c.index() == 0) f = true;
|
|
||||||
if (f) {
|
|
||||||
b.animate({
|
|
||||||
left: 0 - e.width
|
|
||||||
}, {
|
|
||||||
duration: 500,
|
|
||||||
queue: false
|
|
||||||
});
|
|
||||||
c.css({
|
|
||||||
opacity: "1.0",
|
|
||||||
position: "absolute",
|
|
||||||
top: "0px",
|
|
||||||
left: e.width,
|
|
||||||
width: e.width,
|
|
||||||
height: e.height
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
b.animate({
|
|
||||||
left: e.width
|
|
||||||
}, {
|
|
||||||
duration: 500,
|
|
||||||
queue: false
|
|
||||||
});
|
|
||||||
c.css({
|
|
||||||
opacity: "1.0",
|
|
||||||
position: "absolute",
|
|
||||||
top: "0px",
|
|
||||||
left: 0 - e.width,
|
|
||||||
width: e.width,
|
|
||||||
height: e.height
|
|
||||||
})
|
|
||||||
}
|
|
||||||
b.parent().parent().parent().find(".mini_thumbnail_buttons").each(function (b) {
|
|
||||||
var d = a(this);
|
|
||||||
d.css({
|
|
||||||
"background-position": "top left"
|
|
||||||
});
|
|
||||||
d.data("on", false);
|
|
||||||
d.removeClass("thumbison");
|
|
||||||
d.find(".timer").css({
|
|
||||||
backgroundPosition: "0px 0px"
|
|
||||||
});
|
|
||||||
if (b == c.parent().find("li").size() - c.index() - 1) {
|
|
||||||
d.data("on", true);
|
|
||||||
d.css({
|
|
||||||
"background-position": "bottom right"
|
|
||||||
});
|
|
||||||
d.addClass("thumbison")
|
|
||||||
}
|
|
||||||
});
|
|
||||||
var g = c.find("#before").parent().parent();
|
|
||||||
g.css({
|
|
||||||
width: d.find("#divider").position().left + "px",
|
|
||||||
overflow: "hidden"
|
|
||||||
});
|
|
||||||
c.animate({
|
|
||||||
left: "0px",
|
|
||||||
top: "0px",
|
|
||||||
opacity: "1.0"
|
|
||||||
}, {
|
|
||||||
duration: 500,
|
|
||||||
queue: false
|
|
||||||
});
|
|
||||||
d.data("currentSlide", c);
|
|
||||||
o(c, 500)
|
|
||||||
}
|
|
||||||
|
|
||||||
function f(b) {
|
|
||||||
b.find("li >img").each(function () {
|
|
||||||
var b = a(this);
|
|
||||||
b.attr({
|
|
||||||
id: "before"
|
|
||||||
});
|
|
||||||
if (b.attr("alt").length != 0 && b.attr("alt") != null) {
|
|
||||||
b.parent().append("<img id='after' src='" + b.attr("alt") + "'>")
|
|
||||||
} else {
|
|
||||||
b.parent().append("<img id='before' src='" + b.attr("src") + "'>")
|
|
||||||
}
|
|
||||||
b.parent().find("#before, #after").wrapAll("<div id='ba_images'></div>");
|
|
||||||
b.parent().find("#after").wrap("<div id='ext_ext_after'><div id='ext_after'></div></div>");
|
|
||||||
b.parent().find("#before").wrap("<div id='ext_ext_before'><div id='ext_before' class='set_imd'></div></div>");
|
|
||||||
var c = b.parent().parent().parent().find("#after").parent().parent();
|
|
||||||
var d = c.find("#after").parent();
|
|
||||||
var e = d.find("#after");
|
|
||||||
var f = b.parent().parent().parent().find("#before").parent().parent();
|
|
||||||
var g = f.find("#before").parent();
|
|
||||||
var h = g.find("#before");
|
|
||||||
c.css({
|
|
||||||
position: "absolute",
|
|
||||||
"z-index": "0",
|
|
||||||
top: "0px"
|
|
||||||
});
|
|
||||||
f.css({
|
|
||||||
position: "absolute",
|
|
||||||
"z-index": "1",
|
|
||||||
top: "0px",
|
|
||||||
left: "0px"
|
|
||||||
});
|
|
||||||
c.parent().css({
|
|
||||||
"z-index": 1
|
|
||||||
});
|
|
||||||
c.onselectstart = function () {
|
|
||||||
return false
|
|
||||||
};
|
|
||||||
f.onselectstart = function () {
|
|
||||||
return false
|
|
||||||
};
|
|
||||||
var i = a("<div id='loader' class='loader'></div>");
|
|
||||||
a(c).parent().parent().append(i);
|
|
||||||
d.find("img").load(function () {
|
|
||||||
b.parent().parent().parent().parent().find("#loader").each(function () {
|
|
||||||
var b = a(this);
|
|
||||||
b.remove()
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function e(b) {
|
|
||||||
var c = a("<div id='divider'></div>");
|
|
||||||
b.find("#mask").append(c);
|
|
||||||
var d = a("<div id='drag'></div>");
|
|
||||||
b.find("#mask").append(d);
|
|
||||||
d.hover(function () {
|
|
||||||
var b = a(this);
|
|
||||||
b.css({
|
|
||||||
"background-position": "left bottom"
|
|
||||||
})
|
|
||||||
}, function () {
|
|
||||||
var b = a(this);
|
|
||||||
b.css({
|
|
||||||
"background-position": "left top"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
b.onselectstart = function () {
|
|
||||||
return false
|
|
||||||
};
|
|
||||||
b.hover(function () {
|
|
||||||
var b = a(this);
|
|
||||||
if (!(a.browser.msie && a.browser.version >= 7 && a.browser.version < 9)) {
|
|
||||||
b.find("#drag").animate({
|
|
||||||
opacity: 1
|
|
||||||
}, {
|
|
||||||
duration: 200,
|
|
||||||
queue: false
|
|
||||||
});
|
|
||||||
b.find("#divider").animate({
|
|
||||||
opacity: 1
|
|
||||||
}, 200)
|
|
||||||
}
|
|
||||||
}, function () {
|
|
||||||
if (!(a.browser.msie && a.browser.version >= 7 && a.browser.version < 9)) {
|
|
||||||
$this.find("#drag").animate({
|
|
||||||
opacity: .3
|
|
||||||
}, 200);
|
|
||||||
$this.find("#divider").animate({
|
|
||||||
opacity: .3
|
|
||||||
}, 200)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
function d(b, c) {
|
|
||||||
var e = b.data("ba_images");
|
|
||||||
var f = b.data("ba_imagesLoaded");
|
|
||||||
var g = new Image;
|
|
||||||
a(g).css("display", "none");
|
|
||||||
a(g).attr("src", e[f]);
|
|
||||||
if (g.complete || g.readyState === 4) {
|
|
||||||
f++;
|
|
||||||
if (f == e.length) {
|
|
||||||
m(b, c)
|
|
||||||
} else {
|
|
||||||
b.data("ba_imagesLoaded", f);
|
|
||||||
d(b, c)
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
a(g).load(function () {
|
|
||||||
f++;
|
|
||||||
if (f == e.length) {
|
|
||||||
m(b, c)
|
|
||||||
} else {
|
|
||||||
b.data("ba_imagesLoaded", f);
|
|
||||||
d(b, c)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function c(b) {
|
|
||||||
var c = new Array;
|
|
||||||
var d = 0;
|
|
||||||
b.find("ul li:first img").each(function (b) {
|
|
||||||
var e = a(this);
|
|
||||||
c[d] = e.attr("src");
|
|
||||||
d++
|
|
||||||
});
|
|
||||||
b.data("ba_images", c)
|
|
||||||
}
|
|
||||||
a.fn.extend({
|
|
||||||
beforeAfter_slider: function (b) {
|
|
||||||
var g = {
|
|
||||||
width: 876,
|
|
||||||
height: 300,
|
|
||||||
start_from: "left",
|
|
||||||
start_pos: 30,
|
|
||||||
follow: true
|
|
||||||
};
|
|
||||||
var b = a.extend({}, a.fn.beforeAfter_slider.defaults, b);
|
|
||||||
return this.each(function () {
|
|
||||||
var g = new Array;
|
|
||||||
var h = 0;
|
|
||||||
var i = a(this);
|
|
||||||
i.onselectstart = function () {
|
|
||||||
return false
|
|
||||||
};
|
|
||||||
var l = b;
|
|
||||||
l.ie = a.browser.msie && a.browser.version >= 7 && a.browser.version < 9;
|
|
||||||
l.topon = a(this);
|
|
||||||
i.data("off", parseInt(i.css("padding-top")));
|
|
||||||
i.data("ba_imagesLoaded", 0);
|
|
||||||
var n = i.find("li").first();
|
|
||||||
i.data("currentSlide", n);
|
|
||||||
j(i, l);
|
|
||||||
e(i);
|
|
||||||
f(i);
|
|
||||||
var o = a("<div id='mainloader' class='loader'></div>");
|
|
||||||
i.append(o);
|
|
||||||
if (l.ie != true) {
|
|
||||||
i.find("ul li").css({
|
|
||||||
opacity: "0.0"
|
|
||||||
});
|
|
||||||
i.find("#divider").css({
|
|
||||||
opacity: "0.0"
|
|
||||||
});
|
|
||||||
i.find("#drag").css({
|
|
||||||
opacity: "0.0"
|
|
||||||
})
|
|
||||||
}
|
|
||||||
i.data("dragH", i.find("#drag").height() / 2);
|
|
||||||
k(i, l);
|
|
||||||
c(i);
|
|
||||||
if (l.ie) m(i, l);
|
|
||||||
else d(i, l)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
});
|
|
||||||
})(jQuery)
|
|
||||||
@ -1,149 +0,0 @@
|
|||||||
(function (a) {
|
|
||||||
a.fn.extend({
|
|
||||||
freshlineDemo_init: function (b) {
|
|
||||||
var c = this;
|
|
||||||
return this.each(function () {
|
|
||||||
c.find("#demo-settings,#panel").hover(function () {
|
|
||||||
c.find("#panel").stop();
|
|
||||||
c.find("#panel").animate({
|
|
||||||
opacity: 1,
|
|
||||||
height: "200px",
|
|
||||||
"margin-top": "-160px"
|
|
||||||
}, {
|
|
||||||
duration: 400
|
|
||||||
})
|
|
||||||
}, function () {
|
|
||||||
c.find("#panel").stop();
|
|
||||||
c.find("#panel").animate({
|
|
||||||
opacity: 0,
|
|
||||||
height: "0px",
|
|
||||||
"margin-top": "0px"
|
|
||||||
}, {
|
|
||||||
duration: 400
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#bgselector li").each(function () {
|
|
||||||
a(this).click(function (b) {
|
|
||||||
c.find("#bgselector li").each(function () {
|
|
||||||
a(document).find("body").removeClass(a(this).attr("class"))
|
|
||||||
});
|
|
||||||
a(document).find("body").addClass(a(this).attr("class"))
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#borderselector li").each(function () {
|
|
||||||
a(this).click(function (b) {
|
|
||||||
c.find("#borderselector li").each(function () {
|
|
||||||
a(document).find("#example").removeClass(a(this).attr("class"))
|
|
||||||
});
|
|
||||||
a(document).find("#example").css({
|
|
||||||
"background-color": a(this).css("background-color")
|
|
||||||
});
|
|
||||||
a(document).find("#example").addClass(a(this).attr("class"))
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#rounded").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").css({
|
|
||||||
"-webkit-border-radius": "10px",
|
|
||||||
"-moz-border-radius": "10px",
|
|
||||||
"border-radius": " 10px"
|
|
||||||
});
|
|
||||||
a(document).find("#mask").css({
|
|
||||||
"-webkit-border-radius": "10px",
|
|
||||||
"-moz-border-radius": "10px",
|
|
||||||
"border-radius": " 10px"
|
|
||||||
});
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#square").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#square").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").css({
|
|
||||||
"-webkit-border-radius": "0px",
|
|
||||||
"-moz-border-radius": "0px",
|
|
||||||
"border-radius": " 0px"
|
|
||||||
});
|
|
||||||
a(document).find("#mask").css({
|
|
||||||
"-webkit-border-radius": "0px",
|
|
||||||
"-moz-border-radius": "0px",
|
|
||||||
"border-radius": " 0px"
|
|
||||||
});
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#rounded").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#photo").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").css({
|
|
||||||
"padding-top": "10px",
|
|
||||||
"padding-bottom": "70px"
|
|
||||||
});
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#normal").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#normal").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").css({
|
|
||||||
"padding-top": "10px",
|
|
||||||
"padding-bottom": "10px"
|
|
||||||
});
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#photo").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#shadow1").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").removeClass("shadow2");
|
|
||||||
a(document).find(".beforeafter_slider").removeClass("shadow3");
|
|
||||||
a(document).find(".beforeafter_slider").addClass("shadow1");
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#shadow2").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
});
|
|
||||||
c.find("#shadow3").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#shadow2").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").removeClass("shadow1");
|
|
||||||
a(document).find(".beforeafter_slider").removeClass("shadow3");
|
|
||||||
a(document).find(".beforeafter_slider").addClass("shadow2");
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#shadow1").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
});
|
|
||||||
c.find("#shadow3").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
});
|
|
||||||
c.find("#shadow3").click(function () {
|
|
||||||
a(document).find(".beforeafter_slider").removeClass("shadow1");
|
|
||||||
a(document).find(".beforeafter_slider").removeClass("shadow2");
|
|
||||||
a(document).find(".beforeafter_slider").addClass("shadow3");
|
|
||||||
a(this).css({
|
|
||||||
color: "#1f2120"
|
|
||||||
});
|
|
||||||
c.find("#shadow1").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
});
|
|
||||||
c.find("#shadow2").css({
|
|
||||||
color: "#A6B8CC"
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})(jQuery)
|
|
||||||
File diff suppressed because one or more lines are too long
8
10.大屏音乐/js/ie/html5shiv.js
vendored
8
10.大屏音乐/js/ie/html5shiv.js
vendored
@ -1,8 +0,0 @@
|
|||||||
/*
|
|
||||||
HTML5 Shiv v3.7.0 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
|
|
||||||
*/
|
|
||||||
(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
|
|
||||||
a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}</style>";
|
|
||||||
c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
|
|
||||||
"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);
|
|
||||||
if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
|
|
||||||
1
10.大屏音乐/js/ie/respond.min.js
vendored
1
10.大屏音乐/js/ie/respond.min.js
vendored
@ -1 +0,0 @@
|
|||||||
window.matchMedia=window.matchMedia||function(a){"use strict";var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='­<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(document),function(a){"use strict";function b(){v(!0)}var c={};if(a.respond=c,c.update=function(){},c.mediaQueriesSupported=a.matchMedia&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var d,e,f,g=a.document,h=g.documentElement,i=[],j=[],k=[],l={},m=30,n=g.getElementsByTagName("head")[0]||h,o=g.getElementsByTagName("base")[0],p=n.getElementsByTagName("link"),q=[],r=function(){for(var b=0;b<p.length;b++){var c=p[b],d=c.href,e=c.media,f=c.rel&&"stylesheet"===c.rel.toLowerCase();d&&f&&!l[d]&&(c.styleSheet&&c.styleSheet.rawCssText?(t(c.styleSheet.rawCssText,d,e),l[d]=!0):(!/^([a-zA-Z:]*\/\/)/.test(d)&&!o||d.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&("//"==d.substring(0,2)&&(d=location.protocol+d),q.push({href:d,media:e})))}s()},s=function(){if(q.length){var b=q.shift();w(b.href,function(c){t(c,b.href,b.media),l[b.href]=!0,a.setTimeout(function(){s()},0)})}},t=function(a,b,c){var d=a.match(/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi),e=d&&d.length||0;b=b.substring(0,b.lastIndexOf("/"));var f=function(a){return a.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+b+"$2$3")},g=!e&&c;b.length&&(b+="/"),g&&(e=1);for(var h=0;e>h;h++){var k,l,m,n;g?(k=c,j.push(f(a))):(k=d[h].match(/@media *([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1,j.push(RegExp.$2&&f(RegExp.$2))),m=k.split(","),n=m.length;for(var o=0;n>o;o++)l=m[o],i.push({media:l.split("(")[0].match(/(only\s+)?([a-zA-Z]+)\s?/)&&RegExp.$2||"all",rules:j.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(/\(\s*min\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(/\(\s*max\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}v()},u=function(){var a,b=g.createElement("div"),c=g.body,d=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=d=g.createElement("body"),c.style.background="none"),c.appendChild(b),h.insertBefore(c,h.firstChild),a=b.offsetWidth,d?h.removeChild(c):c.removeChild(b),a=f=parseFloat(a)},v=function(b){var c="clientWidth",l=h[c],o="CSS1Compat"===g.compatMode&&l||g.body[c]||l,q={},r=p[p.length-1],s=(new Date).getTime();if(b&&d&&m>s-d)return a.clearTimeout(e),e=a.setTimeout(v,m),void 0;d=s;for(var t in i)if(i.hasOwnProperty(t)){var w=i[t],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?f||u():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?f||u():1)),w.hasquery&&(z&&A||!(z||o>=x)||!(A||y>=o))||(q[w.media]||(q[w.media]=[]),q[w.media].push(j[w.rules]))}for(var C in k)k.hasOwnProperty(C)&&k[C]&&k[C].parentNode===n&&n.removeChild(k[C]);for(var D in q)if(q.hasOwnProperty(D)){var E=g.createElement("style"),F=q[D].join("\n");E.type="text/css",E.media=D,n.insertBefore(E,r.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(g.createTextNode(F)),k.push(E)}},w=function(a,b){var c=x();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},x=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}();r(),c.update=r,a.addEventListener?a.addEventListener("resize",b,!1):a.attachEvent&&a.attachEvent("onresize",b)}}(this);
|
|
||||||
Binary file not shown.
@ -1,76 +0,0 @@
|
|||||||
/*
|
|
||||||
* Playlist Object for the jPlayer Plugin
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2013 Happyworm Ltd
|
|
||||||
* Dual licensed under the MIT and GPL licenses.
|
|
||||||
* - http://www.opensource.org/licenses/mit-license.php
|
|
||||||
* - http://www.gnu.org/copyleft/gpl.html
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 2.3.0
|
|
||||||
* Date: 20th April 2013
|
|
||||||
*
|
|
||||||
* Requires:
|
|
||||||
* - jQuery 1.7.0+
|
|
||||||
* - jPlayer 2.3.0+
|
|
||||||
*/
|
|
||||||
(function (b, f) {
|
|
||||||
jPlayerPlaylist = function (a, c, d) {
|
|
||||||
var e = this; this.current = 0; this.removing = this.shuffled = this.loop = !1; this.cssSelector = b.extend({}, this._cssSelector, a); this.options = b.extend(!0, { keyBindings: { next: { key: 39, fn: function () { e.next() } }, previous: { key: 37, fn: function () { e.previous() } } } }, this._options, d); this.playlist = []; this.original = []; this._initPlaylist(c); this.cssSelector.title = this.cssSelector.cssSelectorAncestor + " .jp-title"; this.cssSelector.playlist = this.cssSelector.cssSelectorAncestor + " .jp-playlist";
|
|
||||||
this.cssSelector.next = this.cssSelector.cssSelectorAncestor + " .jp-next"; this.cssSelector.previous = this.cssSelector.cssSelectorAncestor + " .jp-previous"; this.cssSelector.shuffle = this.cssSelector.cssSelectorAncestor + " .jp-shuffle"; this.cssSelector.shuffleOff = this.cssSelector.cssSelectorAncestor + " .jp-shuffle-off"; this.options.cssSelectorAncestor = this.cssSelector.cssSelectorAncestor; this.options.repeat = function (a) { e.loop = a.jPlayer.options.loop }; b(this.cssSelector.jPlayer).bind(b.jPlayer.event.ready, function () { e._init() });
|
|
||||||
b(this.cssSelector.jPlayer).bind(b.jPlayer.event.ended, function () { e.next() }); b(this.cssSelector.jPlayer).bind(b.jPlayer.event.play, function () { b(this).jPlayer("pauseOthers") }); b(this.cssSelector.jPlayer).bind(b.jPlayer.event.resize, function (a) { a.jPlayer.options.fullScreen ? b(e.cssSelector.title).show() : b(e.cssSelector.title).hide() }); b(this.cssSelector.previous).click(function () { e.previous(); b(this).blur(); return !1 }); b(this.cssSelector.next).click(function () { e.next(); b(this).blur(); return !1 }); b(this.cssSelector.shuffle).click(function () {
|
|
||||||
e.shuffle(!0);
|
|
||||||
return !1
|
|
||||||
}); b(this.cssSelector.shuffleOff).click(function () { e.shuffle(!1); return !1 }).hide(); this.options.fullScreen || b(this.cssSelector.title).hide(); b(this.cssSelector.playlist + " ul").empty(); this._createItemHandlers(); b(this.cssSelector.jPlayer).jPlayer(this.options)
|
|
||||||
}; jPlayerPlaylist.prototype = {
|
|
||||||
_cssSelector: { jPlayer: "#jquery_jplayer_1", cssSelectorAncestor: "#jp_container_1" }, _options: {
|
|
||||||
playlistOptions: {
|
|
||||||
autoPlay: !1, loopOnPrevious: !1, shuffleOnLoop: !0, enableRemoveControls: !1, displayTime: "slow", addTime: "fast",
|
|
||||||
removeTime: "fast", shuffleTime: "slow", itemClass: "jp-playlist-item", freeGroupClass: "jp-free-media", freeItemClass: "jp-playlist-item-free", removeItemClass: "jp-playlist-item-remove"
|
|
||||||
}
|
|
||||||
}, option: function (a, b) { if (b === f) return this.options.playlistOptions[a]; this.options.playlistOptions[a] = b; switch (a) { case "enableRemoveControls": this._updateControls(); break; case "itemClass": case "freeGroupClass": case "freeItemClass": case "removeItemClass": this._refresh(!0), this._createItemHandlers() }return this }, _init: function () {
|
|
||||||
var a =
|
|
||||||
this; this._refresh(function () { a.options.playlistOptions.autoPlay ? a.play(a.current) : a.select(a.current) })
|
|
||||||
}, _initPlaylist: function (a) { this.current = 0; this.removing = this.shuffled = !1; this.original = b.extend(!0, [], a); this._originalPlaylist() }, _originalPlaylist: function () { var a = this; this.playlist = []; b.each(this.original, function (b) { a.playlist[b] = a.original[b] }) }, _refresh: function (a) {
|
|
||||||
var c = this; if (a && !b.isFunction(a)) b(this.cssSelector.playlist + " ul").empty(), b.each(this.playlist, function (a) {
|
|
||||||
b(c.cssSelector.playlist +
|
|
||||||
" ul").append(c._createListItem(c.playlist[a]))
|
|
||||||
}), this._updateControls(); else { var d = b(this.cssSelector.playlist + " ul").children().length ? this.options.playlistOptions.displayTime : 0; b(this.cssSelector.playlist + " ul").slideUp(d, function () { var d = b(this); b(this).empty(); b.each(c.playlist, function (a) { d.append(c._createListItem(c.playlist[a])) }); c._updateControls(); b.isFunction(a) && a(); c.playlist.length ? b(this).slideDown(c.options.playlistOptions.displayTime) : b(this).show() }) }
|
|
||||||
}, _createListItem: function (a) {
|
|
||||||
var c =
|
|
||||||
this, d = "<li><div>", d = d + ("<a href='javascript:;' class='" + this.options.playlistOptions.removeItemClass + "'>×</a>"); if (a.free) { var e = !0, d = d + ("<span class='" + this.options.playlistOptions.freeGroupClass + "'>("); b.each(a, function (a, f) { b.jPlayer.prototype.format[a] && (e ? e = !1 : d += " | ", d += "<a class='" + c.options.playlistOptions.freeItemClass + "' href='" + f + "' tabindex='1'>" + a + "</a>") }); d += ")</span>" } d += "<a href='javascript:;' class='" + this.options.playlistOptions.itemClass + "' tabindex='1'>" + a.title + (a.artist ?
|
|
||||||
" <span class='jp-artist'>by " + a.artist + "</span>" : "") + "</a>"; return d += "</div></li>"
|
|
||||||
}, _createItemHandlers: function () {
|
|
||||||
var a = this; b(this.cssSelector.playlist).off("click", "a." + this.options.playlistOptions.itemClass).on("click", "a." + this.options.playlistOptions.itemClass, function () { var c = b(this).parent().parent().index(); a.current !== c ? a.play(c) : b(a.cssSelector.jPlayer).jPlayer("play"); b(this).blur(); return !1 }); b(this.cssSelector.playlist).off("click", "a." + this.options.playlistOptions.freeItemClass).on("click",
|
|
||||||
"a." + this.options.playlistOptions.freeItemClass, function () { b(this).parent().parent().find("." + a.options.playlistOptions.itemClass).click(); b(this).blur(); return !1 }); b(this.cssSelector.playlist).off("click", "a." + this.options.playlistOptions.removeItemClass).on("click", "a." + this.options.playlistOptions.removeItemClass, function () { var c = b(this).parent().parent().index(); a.remove(c); b(this).blur(); return !1 })
|
|
||||||
}, _updateControls: function () {
|
|
||||||
this.options.playlistOptions.enableRemoveControls ? b(this.cssSelector.playlist +
|
|
||||||
" ." + this.options.playlistOptions.removeItemClass).show() : b(this.cssSelector.playlist + " ." + this.options.playlistOptions.removeItemClass).hide(); this.shuffled ? (b(this.cssSelector.shuffleOff).show(), b(this.cssSelector.shuffle).hide()) : (b(this.cssSelector.shuffleOff).hide(), b(this.cssSelector.shuffle).show())
|
|
||||||
}, _highlight: function (a) {
|
|
||||||
this.playlist.length && a !== f && (b(this.cssSelector.playlist + " .jp-playlist-current").removeClass("jp-playlist-current"), b(this.cssSelector.playlist + " li:nth-child(" + (a + 1) +
|
|
||||||
")").addClass("jp-playlist-current").find(".jp-playlist-item").addClass("jp-playlist-current"), b(this.cssSelector.title + " li").html(this.playlist[a].title + (this.playlist[a].artist ? " <span class='jp-artist'>by " + this.playlist[a].artist + "</span>" : "")))
|
|
||||||
}, setPlaylist: function (a) { this._initPlaylist(a); this._init() }, add: function (a, c) {
|
|
||||||
b(this.cssSelector.playlist + " ul").append(this._createListItem(a)).find("li:last-child").hide().slideDown(this.options.playlistOptions.addTime); this._updateControls(); this.original.push(a);
|
|
||||||
this.playlist.push(a); c ? this.play(this.playlist.length - 1) : 1 === this.original.length && this.select(0)
|
|
||||||
}, remove: function (a) {
|
|
||||||
var c = this; if (a === f) return this._initPlaylist([]), this._refresh(function () { b(c.cssSelector.jPlayer).jPlayer("clearMedia") }), !0; if (this.removing) return !1; a = 0 > a ? c.original.length + a : a; 0 <= a && a < this.playlist.length && (this.removing = !0, b(this.cssSelector.playlist + " li:nth-child(" + (a + 1) + ")").slideUp(this.options.playlistOptions.removeTime, function () {
|
|
||||||
b(this).remove(); if (c.shuffled) {
|
|
||||||
var d =
|
|
||||||
c.playlist[a]; b.each(c.original, function (a) { if (c.original[a] === d) return c.original.splice(a, 1), !1 })
|
|
||||||
} else c.original.splice(a, 1); c.playlist.splice(a, 1); c.original.length ? a === c.current ? (c.current = a < c.original.length ? c.current : c.original.length - 1, c.select(c.current)) : a < c.current && c.current-- : (b(c.cssSelector.jPlayer).jPlayer("clearMedia"), c.current = 0, c.shuffled = !1, c._updateControls()); c.removing = !1
|
|
||||||
})); return !0
|
|
||||||
}, select: function (a) {
|
|
||||||
a = 0 > a ? this.original.length + a : a; 0 <= a && a < this.playlist.length ? (this.current =
|
|
||||||
a, this._highlight(a), b(this.cssSelector.jPlayer).jPlayer("setMedia", this.playlist[this.current])) : this.current = 0
|
|
||||||
}, play: function (a) { a = 0 > a ? this.original.length + a : a; 0 <= a && a < this.playlist.length ? this.playlist.length && (this.select(a), b(this.cssSelector.jPlayer).jPlayer("play")) : a === f && b(this.cssSelector.jPlayer).jPlayer("play") }, pause: function () { b(this.cssSelector.jPlayer).jPlayer("pause") }, next: function () {
|
|
||||||
var a = this.current + 1 < this.playlist.length ? this.current + 1 : 0; this.loop ? 0 === a && this.shuffled && this.options.playlistOptions.shuffleOnLoop &&
|
|
||||||
1 < this.playlist.length ? this.shuffle(!0, !0) : this.play(a) : 0 < a && this.play(a)
|
|
||||||
}, previous: function () { var a = 0 <= this.current - 1 ? this.current - 1 : this.playlist.length - 1; (this.loop && this.options.playlistOptions.loopOnPrevious || a < this.playlist.length - 1) && this.play(a) }, shuffle: function (a, c) {
|
|
||||||
var d = this; a === f && (a = !this.shuffled); (a || a !== this.shuffled) && b(this.cssSelector.playlist + " ul").slideUp(this.options.playlistOptions.shuffleTime, function () {
|
|
||||||
(d.shuffled = a) ? d.playlist.sort(function () { return 0.5 - Math.random() }) :
|
|
||||||
d._originalPlaylist(); d._refresh(!0); c || !b(d.cssSelector.jPlayer).data("jPlayer").status.paused ? d.play(0) : d.select(0); b(this).slideDown(d.options.playlistOptions.shuffleTime)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})(jQuery);
|
|
||||||
@ -1,338 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayerInspector Plugin for jPlayer Plugin for jQuery JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2009 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://www.opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 1.0.5
|
|
||||||
* Date: 1st April 2014
|
|
||||||
*
|
|
||||||
* For use with jPlayer Version: 2.6.0+
|
|
||||||
*
|
|
||||||
* Note: Declare inspector instances after jPlayer instances. ie., Otherwise the jPlayer instance is nonsense.
|
|
||||||
*/
|
|
||||||
|
|
||||||
(function($, undefined) {
|
|
||||||
$.jPlayerInspector = {};
|
|
||||||
$.jPlayerInspector.i = 0;
|
|
||||||
$.jPlayerInspector.defaults = {
|
|
||||||
jPlayer: undefined, // The jQuery selector of the jPlayer instance to inspect.
|
|
||||||
idPrefix: "jplayer_inspector_",
|
|
||||||
visible: false
|
|
||||||
};
|
|
||||||
|
|
||||||
var methods = {
|
|
||||||
init: function(options) {
|
|
||||||
var self = this;
|
|
||||||
var $this = $(this);
|
|
||||||
|
|
||||||
var config = $.extend({}, $.jPlayerInspector.defaults, options);
|
|
||||||
$(this).data("jPlayerInspector", config);
|
|
||||||
|
|
||||||
config.id = $(this).attr("id");
|
|
||||||
config.jPlayerId = config.jPlayer.attr("id");
|
|
||||||
|
|
||||||
config.windowId = config.idPrefix + "window_" + $.jPlayerInspector.i;
|
|
||||||
config.statusId = config.idPrefix + "status_" + $.jPlayerInspector.i;
|
|
||||||
config.configId = config.idPrefix + "config_" + $.jPlayerInspector.i;
|
|
||||||
config.toggleId = config.idPrefix + "toggle_" + $.jPlayerInspector.i;
|
|
||||||
config.eventResetId = config.idPrefix + "event_reset_" + $.jPlayerInspector.i;
|
|
||||||
config.updateId = config.idPrefix + "update_" + $.jPlayerInspector.i;
|
|
||||||
config.eventWindowId = config.idPrefix + "event_window_" + $.jPlayerInspector.i;
|
|
||||||
|
|
||||||
config.eventId = {};
|
|
||||||
config.eventJq = {};
|
|
||||||
config.eventTimeout = {};
|
|
||||||
config.eventOccurrence = {};
|
|
||||||
|
|
||||||
$.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
config.eventId[eventType] = config.idPrefix + "event_" + eventName + "_" + $.jPlayerInspector.i;
|
|
||||||
config.eventOccurrence[eventType] = 0;
|
|
||||||
});
|
|
||||||
|
|
||||||
var structure =
|
|
||||||
'<p><a href="#" id="' + config.toggleId + '">' + (config.visible ? "Hide" : "Show") + '</a> jPlayer Inspector</p>'
|
|
||||||
+ '<div id="' + config.windowId + '">'
|
|
||||||
+ '<div id="' + config.statusId + '"></div>'
|
|
||||||
+ '<div id="' + config.eventWindowId + '" style="padding:5px 5px 0 5px;background-color:#eee;border:1px dotted #000;">'
|
|
||||||
+ '<p style="margin:0 0 10px 0;"><strong>jPlayer events that have occurred over the past 1 second:</strong>'
|
|
||||||
+ '<br />(Backgrounds: <span style="padding:0 5px;background-color:#eee;border:1px dotted #000;">Never occurred</span> <span style="padding:0 5px;background-color:#fff;border:1px dotted #000;">Occurred before</span> <span style="padding:0 5px;background-color:#9f9;border:1px dotted #000;">Occurred</span> <span style="padding:0 5px;background-color:#ff9;border:1px dotted #000;">Multiple occurrences</span> <a href="#" id="' + config.eventResetId + '">reset</a>)</p>';
|
|
||||||
|
|
||||||
// MJP: Would use the next 3 lines for ease, but the events are just slapped on the page.
|
|
||||||
// $.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
// structure += '<div id="' + config.eventId[eventType] + '" style="float:left;">' + eventName + '</div>';
|
|
||||||
// });
|
|
||||||
|
|
||||||
var eventStyle = "float:left;margin:0 5px 5px 0;padding:0 5px;border:1px dotted #000;";
|
|
||||||
// MJP: Doing it longhand so order and layout easier to control.
|
|
||||||
structure +=
|
|
||||||
'<div id="' + config.eventId[$.jPlayer.event.ready] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.setmedia] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.flashreset] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.resize] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.repeat] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.click] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.warning] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.loadstart] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.progress] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.timeupdate] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.volumechange] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.error] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.play] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.pause] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.waiting] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.playing] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.seeking] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.seeked] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.ended] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.loadeddata] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.loadedmetadata] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.canplay] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.canplaythrough] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.suspend] + '" style="clear:left;' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.abort] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.emptied] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.stalled] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.ratechange] + '" style="' + eventStyle + '"></div>'
|
|
||||||
+ '<div id="' + config.eventId[$.jPlayer.event.durationchange] + '" style="' + eventStyle + '"></div>'
|
|
||||||
|
|
||||||
+ '<div style="clear:both"></div>';
|
|
||||||
|
|
||||||
// MJP: Would like a check here in case we missed an event.
|
|
||||||
|
|
||||||
// MJP: Check fails, since it is not on the page yet.
|
|
||||||
/* $.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
if($("#" + config.eventId[eventType])[0] === undefined) {
|
|
||||||
structure += '<div id="' + config.eventId[eventType] + '" style="clear:left;' + eventStyle + '">' + eventName + '</div>';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
*/
|
|
||||||
structure +=
|
|
||||||
'</div>'
|
|
||||||
+ '<p><a href="#" id="' + config.updateId + '">Update</a> jPlayer Inspector</p>'
|
|
||||||
+ '<div id="' + config.configId + '"></div>'
|
|
||||||
+ '</div>';
|
|
||||||
$(this).html(structure);
|
|
||||||
|
|
||||||
config.windowJq = $("#" + config.windowId);
|
|
||||||
config.statusJq = $("#" + config.statusId);
|
|
||||||
config.configJq = $("#" + config.configId);
|
|
||||||
config.toggleJq = $("#" + config.toggleId);
|
|
||||||
config.eventResetJq = $("#" + config.eventResetId);
|
|
||||||
config.updateJq = $("#" + config.updateId);
|
|
||||||
|
|
||||||
$.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
config.eventJq[eventType] = $("#" + config.eventId[eventType]);
|
|
||||||
config.eventJq[eventType].text(eventName + " (" + config.eventOccurrence[eventType] + ")"); // Sets the text to the event name and (0);
|
|
||||||
|
|
||||||
config.jPlayer.bind(eventType + ".jPlayerInspector", function(e) {
|
|
||||||
config.eventOccurrence[e.type]++;
|
|
||||||
if(config.eventOccurrence[e.type] > 1) {
|
|
||||||
config.eventJq[e.type].css("background-color","#ff9");
|
|
||||||
} else {
|
|
||||||
config.eventJq[e.type].css("background-color","#9f9");
|
|
||||||
}
|
|
||||||
config.eventJq[e.type].text(eventName + " (" + config.eventOccurrence[e.type] + ")");
|
|
||||||
// The timer to handle the color
|
|
||||||
clearTimeout(config.eventTimeout[e.type]);
|
|
||||||
config.eventTimeout[e.type] = setTimeout(function() {
|
|
||||||
config.eventJq[e.type].css("background-color","#fff");
|
|
||||||
}, 1000);
|
|
||||||
// The timer to handle the occurences.
|
|
||||||
setTimeout(function() {
|
|
||||||
config.eventOccurrence[e.type]--;
|
|
||||||
config.eventJq[e.type].text(eventName + " (" + config.eventOccurrence[e.type] + ")");
|
|
||||||
}, 1000);
|
|
||||||
if(config.visible) { // Update the status, if inspector open.
|
|
||||||
$this.jPlayerInspector("updateStatus");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
config.jPlayer.bind($.jPlayer.event.ready + ".jPlayerInspector", function(e) {
|
|
||||||
$this.jPlayerInspector("updateConfig");
|
|
||||||
});
|
|
||||||
|
|
||||||
config.toggleJq.click(function() {
|
|
||||||
if(config.visible) {
|
|
||||||
$(this).text("Show");
|
|
||||||
config.windowJq.hide();
|
|
||||||
config.statusJq.empty();
|
|
||||||
config.configJq.empty();
|
|
||||||
} else {
|
|
||||||
$(this).text("Hide");
|
|
||||||
config.windowJq.show();
|
|
||||||
config.updateJq.click();
|
|
||||||
}
|
|
||||||
config.visible = !config.visible;
|
|
||||||
$(this).blur();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
config.eventResetJq.click(function() {
|
|
||||||
$.each($.jPlayer.event, function(eventName,eventType) {
|
|
||||||
config.eventJq[eventType].css("background-color","#eee");
|
|
||||||
});
|
|
||||||
$(this).blur();
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
config.updateJq.click(function() {
|
|
||||||
$this.jPlayerInspector("updateStatus");
|
|
||||||
$this.jPlayerInspector("updateConfig");
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
|
|
||||||
if(!config.visible) {
|
|
||||||
config.windowJq.hide();
|
|
||||||
} else {
|
|
||||||
// config.updateJq.click();
|
|
||||||
}
|
|
||||||
|
|
||||||
$.jPlayerInspector.i++;
|
|
||||||
|
|
||||||
return this;
|
|
||||||
},
|
|
||||||
destroy: function() {
|
|
||||||
$(this).data("jPlayerInspector") && $(this).data("jPlayerInspector").jPlayer.unbind(".jPlayerInspector");
|
|
||||||
$(this).empty();
|
|
||||||
},
|
|
||||||
updateConfig: function() { // This displays information about jPlayer's configuration in inspector
|
|
||||||
|
|
||||||
var jPlayerInfo = "<p>This jPlayer instance is running in your browser where:<br />"
|
|
||||||
|
|
||||||
for(i = 0; i < $(this).data("jPlayerInspector").jPlayer.data("jPlayer").solutions.length; i++) {
|
|
||||||
var solution = $(this).data("jPlayerInspector").jPlayer.data("jPlayer").solutions[i];
|
|
||||||
jPlayerInfo += " jPlayer's <strong>" + solution + "</strong> solution is";
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer")[solution].used) {
|
|
||||||
jPlayerInfo += " being <strong>used</strong> and will support:<strong>";
|
|
||||||
for(format in $(this).data("jPlayerInspector").jPlayer.data("jPlayer")[solution].support) {
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer")[solution].support[format]) {
|
|
||||||
jPlayerInfo += " " + format;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</strong><br />";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += " <strong>not required</strong><br />";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").html.active) {
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").flash.active) {
|
|
||||||
jPlayerInfo += "<strong>Problem with jPlayer since both HTML5 and Flash are active.</strong>";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += "The <strong>HTML5 is active</strong>.";
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").flash.active) {
|
|
||||||
jPlayerInfo += "The <strong>Flash is active</strong>.";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += "No solution is currently active. jPlayer needs a setMedia().";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
var formatType = $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.formatType;
|
|
||||||
jPlayerInfo += "<p><code>status.formatType = '" + formatType + "'</code><br />";
|
|
||||||
if(formatType) {
|
|
||||||
jPlayerInfo += "<code>Browser canPlay('" + $.jPlayer.prototype.format[formatType].codec + "')</code>";
|
|
||||||
} else {
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
}
|
|
||||||
|
|
||||||
jPlayerInfo += "<p><code>status.src = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.src + "'</code></p>";
|
|
||||||
|
|
||||||
jPlayerInfo += "<p><code>status.media = {<br />";
|
|
||||||
for(prop in $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.media) {
|
|
||||||
jPlayerInfo += " " + prop + ": " + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.media[prop] + "<br />"; // Some are strings
|
|
||||||
}
|
|
||||||
jPlayerInfo += "};</code></p>"
|
|
||||||
|
|
||||||
jPlayerInfo += "<p>";
|
|
||||||
jPlayerInfo += "<code>status.videoWidth = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.videoWidth + "'</code>";
|
|
||||||
jPlayerInfo += " | <code>status.videoHeight = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.videoHeight + "'</code>";
|
|
||||||
jPlayerInfo += "<br /><code>status.width = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.width + "'</code>";
|
|
||||||
jPlayerInfo += " | <code>status.height = '" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.height + "'</code>";
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
+ "<p>Raw browser test for HTML5 support. Should equal a function if HTML5 is available.<br />";
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").html.audio.available) {
|
|
||||||
jPlayerInfo += "<code>htmlElement.audio.canPlayType = " + (typeof $(this).data("jPlayerInspector").jPlayer.data("jPlayer").htmlElement.audio.canPlayType) +"</code><br />"
|
|
||||||
}
|
|
||||||
if($(this).data("jPlayerInspector").jPlayer.data("jPlayer").html.video.available) {
|
|
||||||
jPlayerInfo += "<code>htmlElement.video.canPlayType = " + (typeof $(this).data("jPlayerInspector").jPlayer.data("jPlayer").htmlElement.video.canPlayType) +"</code>";
|
|
||||||
}
|
|
||||||
jPlayerInfo += "</p>";
|
|
||||||
|
|
||||||
jPlayerInfo += "<p>This instance is using the constructor options:<br />"
|
|
||||||
+ "<code>$('#" + $(this).data("jPlayerInspector").jPlayer.data("jPlayer").internal.self.id + "').jPlayer({<br />"
|
|
||||||
|
|
||||||
+ " swfPath: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "swfPath") + "',<br />"
|
|
||||||
|
|
||||||
+ " solution: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "solution") + "',<br />"
|
|
||||||
|
|
||||||
+ " supplied: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "supplied") + "',<br />"
|
|
||||||
|
|
||||||
+ " preload: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "preload") + "',<br />"
|
|
||||||
|
|
||||||
+ " volume: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "volume") + ",<br />"
|
|
||||||
|
|
||||||
+ " muted: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "muted") + ",<br />"
|
|
||||||
|
|
||||||
+ " backgroundColor: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "backgroundColor") + "',<br />"
|
|
||||||
|
|
||||||
+ " cssSelectorAncestor: '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "cssSelectorAncestor") + "',<br />"
|
|
||||||
|
|
||||||
+ " cssSelector: {";
|
|
||||||
|
|
||||||
var cssSelector = $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "cssSelector");
|
|
||||||
for(prop in cssSelector) {
|
|
||||||
|
|
||||||
// jPlayerInfo += "<br /> " + prop + ": '" + cssSelector[prop] + "'," // This works too of course, but want to use option method for deep keys.
|
|
||||||
jPlayerInfo += "<br /> " + prop + ": '" + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "cssSelector." + prop) + "',"
|
|
||||||
}
|
|
||||||
|
|
||||||
jPlayerInfo = jPlayerInfo.slice(0, -1); // Because the sloppy comma was bugging me.
|
|
||||||
|
|
||||||
jPlayerInfo += "<br /> },<br />"
|
|
||||||
|
|
||||||
+ " errorAlerts: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "errorAlerts") + ",<br />"
|
|
||||||
|
|
||||||
+ " warningAlerts: " + $(this).data("jPlayerInspector").jPlayer.jPlayer("option", "warningAlerts") + "<br />"
|
|
||||||
|
|
||||||
+ "});</code></p>";
|
|
||||||
$(this).data("jPlayerInspector").configJq.html(jPlayerInfo);
|
|
||||||
return this;
|
|
||||||
},
|
|
||||||
updateStatus: function() { // This displays information about jPlayer's status in the inspector
|
|
||||||
$(this).data("jPlayerInspector").statusJq.html(
|
|
||||||
"<p>jPlayer is " +
|
|
||||||
($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.paused ? "paused" : "playing") +
|
|
||||||
" at time: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.currentTime*10)/10 + "s." +
|
|
||||||
" (d: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.duration*10)/10 + "s" +
|
|
||||||
", sp: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.seekPercent) + "%" +
|
|
||||||
", cpr: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.currentPercentRelative) + "%" +
|
|
||||||
", cpa: " + Math.floor($(this).data("jPlayerInspector").jPlayer.data("jPlayer").status.currentPercentAbsolute) + "%)</p>"
|
|
||||||
);
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
$.fn.jPlayerInspector = function( method ) {
|
|
||||||
// Method calling logic
|
|
||||||
if ( methods[method] ) {
|
|
||||||
return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
|
|
||||||
} else if ( typeof method === 'object' || ! method ) {
|
|
||||||
return methods.init.apply( this, arguments );
|
|
||||||
} else {
|
|
||||||
$.error( 'Method ' + method + ' does not exist on jQuery.jPlayerInspector' );
|
|
||||||
}
|
|
||||||
};
|
|
||||||
})(jQuery);
|
|
||||||
@ -1,125 +0,0 @@
|
|||||||
$(document).ready(function () {
|
|
||||||
var myPlaylist = new jPlayerPlaylist({
|
|
||||||
jPlayer: "#jplayer_N",
|
|
||||||
cssSelectorAncestor: "#jp_container_N"
|
|
||||||
}, [
|
|
||||||
{ title: "樱子小姐的脚下埋着尸体", artist: "大竹佑季", mp3: "http://music.163.com/song/media/outer/url?id=36271375.mp3", poster: "http://p1.music.126.net/Q4Dg5QXwft213TBKMv26_A==/3276544653004159.jpg?param=130y130" },
|
|
||||||
{ title: "非科学的表裏一体", artist: "豚乙女", mp3: "http://music.163.com/song/media/outer/url?id=30870899.mp3", poster: "http://p1.music.126.net/84dpde0vkfsDAVsNNjulXg==/7906588115750467.jpg?param=130y130" },
|
|
||||||
{ title: "You're the Shine", artist: "：FELT", mp3: "http://music.163.com/song/media/outer/url?id=26260757.mp3", poster: "http://p1.music.126.net/b04i7LFbHLJkmkzwhwRLMA==/2343059278838229.jpg?param=130y130" },
|
|
||||||
{ title: "旅の途中", artist: "清浦夏実", mp3: "http://music.163.com/song/media/outer/url?id=26220167.mp3", poster: "http://p1.music.126.net/4BgAnUbCDFex3m4z-hWULA==/2509085534622060.jpg?param=130y130" },
|
|
||||||
{ title: "夏祭り", artist: "東山奈央", mp3: "http://music.163.com/song/media/outer/url?id=488388729.mp3", poster: "http://p1.music.126.net/3eyBH8RjxjXG-EqWShU1wg==/18887410742154555.jpg?param=130y130" },
|
|
||||||
{ title: "Sway", artist: "Nevve", mp3: "http://music.163.com/song/media/outer/url?id=475073464.mp3", poster: "http://p1.music.126.net/KmPcFcxxg61d15R8yu5x_A==/18681802069425034.jpg?param=130y130" },
|
|
||||||
{ title: "Vanish", artist: " Breathe Carolina", mp3: "http://music.163.com/song/media/outer/url?id=427542077.mp3", poster: "http://p1.music.126.net/xaX_RkkW0cT4f38k62N8yg==/3413983630702236.jpg?param=130y130" },
|
|
||||||
{ title: "It's Over", artist: "MEIDEN", mp3: "http://music.163.com/song/media/outer/url?id=477933011.mp3", poster: "http://p1.music.126.net/foJM2P9nq8pXHnCZjcf75w==/19047939439716625.jpg?param=130y130" }
|
|
||||||
],
|
|
||||||
{
|
|
||||||
playlistOptions: {
|
|
||||||
enableRemoveControls: true,
|
|
||||||
autoPlay: false
|
|
||||||
},
|
|
||||||
swfPath: "js/jPlayer",
|
|
||||||
supplied: "webmv, ogv, m4v, oga, mp3",
|
|
||||||
useStateClassSkin: true,
|
|
||||||
autoBlur: false,
|
|
||||||
smoothPlayBar: true,
|
|
||||||
keyEnabled: true,
|
|
||||||
audioFullScreen: false
|
|
||||||
});
|
|
||||||
var latest = [
|
|
||||||
{ title: "The wheel of fortune", artist: "Yang Bingyin", mp3: "http://music.163.com/song/media/outer/url?id=476515941.mp3", poster: "http://p1.music.126.net/4xHOkSVWH-n6p5pB3Jf0yQ==/109951162922204274.jpg?param=130y130" },
|
|
||||||
{ title: "you are my king", artist: "梶浦由記", mp3: "http://music.163.com/song/media/outer/url?id=22731459.mp3", poster: "http://p1.music.126.net/Xy8iaLLLVT21Mr9wDDJBNQ==/792747883650465.jpg?param=130y130" },
|
|
||||||
{ title: "初恋的小美好", artist: "Sunny是个小太阳", mp3: "http://music.163.com/song/media/outer/url?id=529823229.mp3", poster: "http://p1.music.126.net/7DvTdaOADAw7KiKVkcMcag==/109951163105691071.jpg?param=130y130" },
|
|
||||||
{ title: "Lilac", artist: "MANYO", mp3: "http://music.163.com/song/media/outer/url?id=28466087.mp3", poster: "http://p1.music.126.net/scAe3f-GkQvo2h91Gpb0Bg==/1729531800492601.jpg?param=130y130" },
|
|
||||||
{ title: "一人静", artist: "姫神", mp3: "http://music.163.com/song/media/outer/url?id=25917069.mp3", poster: "http://p1.music.126.net/FnElEjsh00iuHWtHXrcY9g==/5638295627307829.jpg?param=130y130" },
|
|
||||||
{ title: "Through My Blood", artist: "Aimer", mp3: "http://music.163.com/song/media/outer/url?id=409872505.mp3", poster: "http://p1.music.126.net/45Qck88DR58FGgdHdDqfBw==/18181524277717113.jpg?param=130y130" },
|
|
||||||
{ title: "Too Late To Say", artist: "Sayulee", mp3: "http://music.163.com/song/media/outer/url?id=486194219.mp3", poster: "http://p1.music.126.net/Oa_1_y0a8NCmxB1zYKAFpw==/19187577416516096.jpg?param=130y130" },
|
|
||||||
{ title: "琥珀色の海へ", artist: "40㍍P", mp3: "http://music.163.com/song/media/outer/url?id=836411.mp3", poster: "http://p1.music.126.net/80iknoJfJHHLUSjz_EiSDw==/18736777650906624.jpg?param=130y130" },
|
|
||||||
{ title: "からくりピエロ (instrumental)", artist: "MUSIRISCA", mp3: "http://music.163.com/song/media/outer/url?id=33004714.mp3", poster: "http://p1.music.126.net/9kAx7AtyLbLop_XhJy3y5w==/3415083117091737.jpg?param=130y130" },
|
|
||||||
{ title: "M04", artist: "梶浦由記", mp3: "http://music.163.com/song/media/outer/url?id=591901.mp3", poster: "http://p1.music.126.net/Rm8d72Gom9BZcDOmPBPPkA==/2923601420858492.jpg?param=130y130" },
|
|
||||||
{ title: "M35", artist: "梶浦由記", mp3: "http://music.163.com/song/media/outer/url?id=28267707.mp3", poster: "http://p1.music.126.net/a-fgC2MhmKzNNOrmrQ_CMA==/5972547162126209.jpg?param=130y130" },
|
|
||||||
{ title: "哈尔的移动城堡", artist: "久石譲", mp3: "http://music.163.com/song/media/outer/url?id=481390254.mp3", poster: "http://p1.music.126.net/BmJ2bUsQwinDU2KiDsKkEQ==/5998935441331080.jpg?param=130y130" },
|
|
||||||
{ title: "流れ星 ", artist: "久石譲", mp3: "http://music.163.com/song/media/outer/url?id=26902975.mp3", poster: "http://p1.music.126.net/cJrHNkktHNG62uKdYvGahg==/4453022092508799.jpg?param=130y130" },
|
|
||||||
{ title: "Memories", artist: "Within Temptation", mp3: "http://music.163.com/song/media/outer/url?id=407002778.mp3", poster: "http://p1.music.126.net/cqNHhKOTcfkwIM8_YIaT1w==/3275445150564990.jpg?param=130y130" },
|
|
||||||
{ title: "それがあなたの幸せとしても", artist: "rairu", mp3: "http://music.163.com/song/media/outer/url?id=41654821.mp3", poster: "http://p1.music.126.net/SpovasHBud2A1qXXADXsBg==/109951163167455610.jpg?param=130y130" },
|
|
||||||
{ title: "Angel", artist: "阿桑", mp3: "http://music.163.com/song/media/outer/url?id=205276.mp3", poster: "http://p1.music.126.net/8cSVJulJa2tiLydRxyXuTg==/109951162938339077.jpg?param=130y130" },
|
|
||||||
{ title: "兰若词", artist: "刘亦菲", mp3: "http://music.163.com/song/media/outer/url?id=255739.mp3", poster: "http://p1.music.126.net/L4Sah2hA5QYBPUnpjjUQ0Q==/26388279081790.jpg?param=130y130" },
|
|
||||||
{ title: "Pieces Of My Words-言の花-", artist: "刘亦菲", mp3: "http://music.163.com/song/media/outer/url?id=255805.mp3", poster: "http://p1.music.126.net/L4Sah2hA5QYBPUnpjjUQ0Q==/26388279081790.jpg?param=130y130" }
|
|
||||||
];
|
|
||||||
|
|
||||||
var spirit = [
|
|
||||||
{ title: "M19+20", artist: "梶浦由記", mp3: "http://music.163.com/song/media/outer/url?id=591753.mp3 ", poster: "http://p1.music.126.net/lW4YKD6cMgm32nI66CzWVg==/5702067301704441.jpg?param=130y130" },
|
|
||||||
{ title: "Sis puella magica!", artist: "梶浦由記", mp3: "http://music.163.com/song/media/outer/url?id=496902072.mp3", poster: "http://p1.music.126.net/tFTRt1H87rReNTyO1K9IDQ==/18498183627713149.jpg?param=130y130" },
|
|
||||||
{ title: "月は优しく (月)", artist: "梶浦由記", mp3: "http://music.163.com/song/media/outer/url?id=590623.mp3", poster: "http://p1.music.126.net/7xaV2qB-T1d9m8b1XZC6tQ==/725677674344222.jpg?param=130y130" },
|
|
||||||
{ title: "Euterpe エウテルペ ", artist: "染音若蔡", mp3: "http://music.163.com/song/media/outer/url?id=452654214.mp3", poster: "http://p1.music.126.net/Iqckrd2sOB1ztqrSOw4XzA==/109951162841140691.jpg?param=130y130" },
|
|
||||||
{ title: "幻光", artist: "杨秉音", mp3: "http://music.163.com/song/media/outer/url?id=526989692.mp3", poster: "http://p1.music.126.net/4xHOkSVWH-n6p5pB3Jf0yQ==/109951162922204274.jpg" },
|
|
||||||
{ title: "世界の約束", artist: "神罗Shinra", mp3: "http://music.163.com/song/media/outer/url?id=429460870.mp3", poster: "http://p1.music.126.net/rkJSVKRZkfLXOoVwXtiB4w==/18283778858733705.jpg?param=130y130" },
|
|
||||||
{ title: "Cave OF Mind", artist: "久石譲", mp3: "http://music.163.com/song/media/outer/url?id=28457572.mp3", poster: "http://p1.music.126.net/HdmtedPRZEEBduHcmUnk3w==/853221023209311.jpg?param=130y130" },
|
|
||||||
{ title: "幽灵公主", artist: "K. Williams", mp3: "http://music.163.com/song/media/outer/url?id=22812274.mp3", poster: "http://p1.music.126.net/GNKtRK8w7edPw3jAsavL2A==/5980243743832365.jpg?param=130y130" },
|
|
||||||
{ title: "心之逆鳞", artist: "魏小涵", mp3: "http://music.163.com/song/media/outer/url?id=591753.mp3", poster: "http://p1.music.126.net/k_WRxDY1qQ4ztB5uFFrvoA==/17907745881679448.jpg?param=130y130" },
|
|
||||||
{ title: "愛を教えてくれた君へ", artist: "Qaijff", mp3: "http://music.163.com/song/media/outer/url?id=521416051.mp3", poster: "http://p1.music.126.net/-c3qURPNRNLe-YJMbiZoKA==/109951163072509863.jpg?param=130y130" },
|
|
||||||
{ title: "群雄疾走", artist: "川井憲次", mp3: "http://music.163.com/song/media/outer/url?id=448153.mp3", poster: "http://p1.music.126.net/r4TK33y6f8cwlntVidXZbQ==/931286348726555.jpg?param=130y130" },
|
|
||||||
{ title: "Ghost of a smile", artist: "EGOIST", mp3: "http://music.163.com/song/media/outer/url?id=35955908.mp3", poster: "http://p1.music.126.net/ivONokvElv9ZCzyrZp84FQ==/3297435373557125.jpg?param=130y130" },
|
|
||||||
|
|
||||||
];
|
|
||||||
$(document).on($.jPlayer.event.pause, myPlaylist.cssSelector.jPlayer, function () {//$(document).on('click','要选择的元素',function(){}) on方法包含很多事件，点击，双击等等事件。
|
|
||||||
$('.musicbar').removeClass('animate'); //look this class and remove it
|
|
||||||
$('.jp-play-me').removeClass('active');
|
|
||||||
$('.jp-play-me').parent('li').removeClass('active');
|
|
||||||
}); 28718070
|
|
||||||
|
|
||||||
$(document).on($.jPlayer.event.play, myPlaylist.cssSelector.jPlayer, function () {
|
|
||||||
$('.musicbar').addClass('animate');// when the player add a animate
|
|
||||||
});
|
|
||||||
$("#before,#after").addClass("set_imd");
|
|
||||||
|
|
||||||
$(document).on('click', '.jp-play-me', function (e) {
|
|
||||||
e && e.preventDefault();
|
|
||||||
var $this = $(e.target);
|
|
||||||
if (!$this.is('a')) $this = $this.closest('a');//closest() 方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上。
|
|
||||||
$('.jp-play-me').not($this).removeClass('active');
|
|
||||||
$('.jp-play-me').parent('li').not($this.parent('li')).removeClass('active');
|
|
||||||
|
|
||||||
$this.toggleClass('active');
|
|
||||||
$this.parent('li').toggleClass('active');
|
|
||||||
if (!$this.hasClass('active')) {
|
|
||||||
myPlaylist.pause();
|
|
||||||
} else {
|
|
||||||
var k = $(this).parent("li").index();
|
|
||||||
|
|
||||||
$(".poster-img").attr("src", latest[k].poster);//此方法返回一个函数改变src $('a.cover1').html('<img src="' + latest[k].poster );
|
|
||||||
$(".musicbar").addClass("animate").index();
|
|
||||||
myPlaylist.add({
|
|
||||||
title: latest[k].title,
|
|
||||||
artist: latest[k].artist,
|
|
||||||
mp3: latest[k].mp3,
|
|
||||||
poster: latest[k].poster
|
|
||||||
});
|
|
||||||
myPlaylist.play(-1);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$(document).on('click', '.jp-play-fun', function (e) {
|
|
||||||
e && e.preventDefault();
|
|
||||||
var $this = $(e.target);
|
|
||||||
if (!$this.is('a')) $this = $this.closest('a');//closest() 方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上。
|
|
||||||
$('.jp-play-fun').not($this).removeClass('active');
|
|
||||||
$('.jp-play-fun').parent('li').not($this.parent('li')).removeClass('active');
|
|
||||||
|
|
||||||
$this.toggleClass('active');
|
|
||||||
$this.parent('li').toggleClass('active');
|
|
||||||
if (!$this.hasClass('active')) {
|
|
||||||
myPlaylist.pause();
|
|
||||||
} else {
|
|
||||||
var k = $(this).parent("li").index();
|
|
||||||
$(".poster-img").attr("src", spirit[k].poster);
|
|
||||||
//此方法返回一个函数改变src $('a.cover1').html('<img src="' + spirit[k].poster );
|
|
||||||
myPlaylist.add({
|
|
||||||
title: spirit[k].title,
|
|
||||||
artist: spirit[k].artist,
|
|
||||||
mp3: spirit[k].mp3,
|
|
||||||
poster: spirit[k].poster
|
|
||||||
});
|
|
||||||
myPlaylist.play(-1);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,196 +0,0 @@
|
|||||||
/*controls*/
|
|
||||||
.jp-controls {
|
|
||||||
display: table;
|
|
||||||
table-layout: fixed;
|
|
||||||
border-spacing: 0;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.jp-controls a{
|
|
||||||
cursor: pointer;
|
|
||||||
display: inline-block;
|
|
||||||
padding: 10px 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-controls a i{
|
|
||||||
line-height: inherit;
|
|
||||||
}
|
|
||||||
.jp-controls > div{
|
|
||||||
display: table-cell;
|
|
||||||
vertical-align: middle;
|
|
||||||
text-align: center;
|
|
||||||
width: 40px;
|
|
||||||
height: 60px;
|
|
||||||
}
|
|
||||||
div.jp-progress{
|
|
||||||
width: auto;
|
|
||||||
padding: 0 15px;
|
|
||||||
vertical-align: top;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.jp-seek-bar{
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
.jp-title{
|
|
||||||
position: absolute;
|
|
||||||
left: 25px;
|
|
||||||
top: 0;
|
|
||||||
right: 25px;
|
|
||||||
display: block !important;
|
|
||||||
line-height: 60px;
|
|
||||||
}
|
|
||||||
.jp-title ul{
|
|
||||||
list-style: none;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-title li{
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
.jp-artist{
|
|
||||||
opacity: 0.6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-play-bar{
|
|
||||||
height: 60px;
|
|
||||||
}
|
|
||||||
.jp-volume{
|
|
||||||
width: 60px !important;
|
|
||||||
padding-right:10px !important;
|
|
||||||
}
|
|
||||||
.jp-volume-bar-value{
|
|
||||||
height: 6px;
|
|
||||||
}
|
|
||||||
a.hid{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*video*/
|
|
||||||
.jp-video{
|
|
||||||
font-size: 0;
|
|
||||||
line-height: 0;
|
|
||||||
min-height: 160px;
|
|
||||||
}
|
|
||||||
.jp-video-play{
|
|
||||||
display: inline-block;
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
top: 50%;
|
|
||||||
cursor: pointer;
|
|
||||||
margin-left: -30px;
|
|
||||||
margin-top: -65px;
|
|
||||||
}
|
|
||||||
.jp-video-full {
|
|
||||||
/* Rules for IE6 (full-screen) */
|
|
||||||
width:480px;
|
|
||||||
height:270px;
|
|
||||||
/* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */
|
|
||||||
position:static !important; position:relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */
|
|
||||||
.jp-video-full div div {
|
|
||||||
z-index:1000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video-full .jp-jplayer {
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
position: fixed !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video-full .jp-gui {
|
|
||||||
position: fixed !important; position: static; /* Rules for IE6 (full-screen) */
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width:100%;
|
|
||||||
height:100%;
|
|
||||||
z-index:1001; /* 1 layer above the others. */
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-video-full .jp-interface {
|
|
||||||
position: absolute !important; position: relative; /* Rules for IE6 (full-screen) */
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*playlist*/
|
|
||||||
|
|
||||||
.jp-playlist ul{
|
|
||||||
max-height: 320px;
|
|
||||||
overflow-x: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
padding: 0;
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-playlist.open ul{
|
|
||||||
display: block !important;
|
|
||||||
bottom: 60px;
|
|
||||||
left: 180px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-playlist li{
|
|
||||||
list-style: none;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-playlist-item{
|
|
||||||
display: block;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
white-space: nowrap;
|
|
||||||
border-top: 1px solid rgba(255, 255, 255, .1);
|
|
||||||
padding: 12px 40px 12px 8px;
|
|
||||||
}
|
|
||||||
.jp-playlist-item:focus{
|
|
||||||
outline: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-playlist-item:before{
|
|
||||||
display: inline-block;
|
|
||||||
text-align: center;
|
|
||||||
width: 30px;
|
|
||||||
font-family: FontAwesome;
|
|
||||||
content:"\f0da";
|
|
||||||
opacity: 0.6;
|
|
||||||
}
|
|
||||||
|
|
||||||
a.jp-playlist-current:before{
|
|
||||||
content:"\f144";
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-playlist li:first-child .jp-playlist-item{
|
|
||||||
border-width: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.jp-playlist-item-remove{
|
|
||||||
font-size: 15px;
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 0;
|
|
||||||
padding: 11px 18px;
|
|
||||||
opacity: 0.6;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
|
||||||
.footer .jp-gui{
|
|
||||||
margin: 0 -10px;
|
|
||||||
}
|
|
||||||
div.jp-progress{
|
|
||||||
padding: 0 10px;
|
|
||||||
}
|
|
||||||
.jp-playlist.open ul{
|
|
||||||
display: block !important;
|
|
||||||
bottom: 60px;
|
|
||||||
left: 0px;
|
|
||||||
right: 0px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
1819
10.大屏音乐/js/jPlayer/jquery.jplayer.min.js
vendored
1819
10.大屏音乐/js/jPlayer/jquery.jplayer.min.js
vendored
File diff suppressed because it is too large
Load Diff
@ -1,583 +0,0 @@
|
|||||||
/*
|
|
||||||
* jPlayer Player Plugin for Popcorn JavaScript Library
|
|
||||||
* http://www.jplayer.org
|
|
||||||
*
|
|
||||||
* Copyright (c) 2012 - 2014 Happyworm Ltd
|
|
||||||
* Licensed under the MIT license.
|
|
||||||
* http://opensource.org/licenses/MIT
|
|
||||||
*
|
|
||||||
* Author: Mark J Panaghiston
|
|
||||||
* Version: 1.1.3
|
|
||||||
* Date: 2nd April 2014
|
|
||||||
*
|
|
||||||
* For Popcorn Version: 1.3
|
|
||||||
* For jPlayer Version: 2.6.0
|
|
||||||
* Requires: jQuery 1.7+
|
|
||||||
* Note: jQuery dependancy cannot be removed since jPlayer 2 is a jQuery plugin. Use of jQuery will be kept to a minimum.
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Code verified using http://www.jshint.com/ */
|
|
||||||
/*jshint asi:false, bitwise:false, boss:false, browser:true, curly:false, debug:false, eqeqeq:true, eqnull:false, evil:false, forin:false, immed:false, jquery:true, laxbreak:false, newcap:true, noarg:true, noempty:true, nonew:true, onevar:false, passfail:false, plusplus:false, regexp:false, undef:true, sub:false, strict:false, white:false, smarttabs:true */
|
|
||||||
/*global Popcorn:false, console:false */
|
|
||||||
|
|
||||||
(function(Popcorn) {
|
|
||||||
|
|
||||||
var JQUERY_SCRIPT = '//code.jquery.com/jquery-1.11.0.min.js', // Used if jQuery not already present.
|
|
||||||
JPLAYER_SCRIPT = '//www.jplayer.org/2.6.0/js/jquery.jplayer.min.js', // Used if jPlayer not already present.
|
|
||||||
JPLAYER_SWFPATH = '//www.jplayer.org/2.6.0/js/Jplayer.swf', // Used if not specified in jPlayer options via SRC Object.
|
|
||||||
SOLUTION = 'html,flash', // The default solution option.
|
|
||||||
DEBUG = false, // Decided to leave the debugging option and console output in for the time being. Overhead is trivial.
|
|
||||||
jQueryDownloading = false, // Flag to stop multiple instances from each pulling in jQuery, thus corrupting it.
|
|
||||||
jPlayerDownloading = false, // Flag to stop multiple instances from each pulling in jPlayer, thus corrupting it.
|
|
||||||
format = { // Duplicate of jPlayer 2.5.0 object, to avoid always requiring jQuery and jPlayer to be loaded before performing the _canPlayType() test.
|
|
||||||
mp3: {
|
|
||||||
codec: 'audio/mpeg; codecs="mp3"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m4a: { // AAC / MP4
|
|
||||||
codec: 'audio/mp4; codecs="mp4a.40.2"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m3u8a: { // AAC / MP4 / Apple HLS
|
|
||||||
codec: 'application/vnd.apple.mpegurl; codecs="mp4a.40.2"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m3ua: { // M3U
|
|
||||||
codec: 'audio/mpegurl',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
oga: { // OGG
|
|
||||||
codec: 'audio/ogg; codecs="vorbis, opus"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
flac: { // FLAC
|
|
||||||
codec: 'audio/x-flac',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
wav: { // PCM
|
|
||||||
codec: 'audio/wav; codecs="1"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
webma: { // WEBM
|
|
||||||
codec: 'audio/webm; codecs="vorbis"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
fla: { // FLV / F4A
|
|
||||||
codec: 'audio/x-flv',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
rtmpa: { // RTMP AUDIO
|
|
||||||
codec: 'audio/rtmp; codecs="rtmp"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'audio'
|
|
||||||
},
|
|
||||||
m4v: { // H.264 / MP4
|
|
||||||
codec: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
m3u8v: { // H.264 / AAC / MP4 / Apple HLS
|
|
||||||
codec: 'application/vnd.apple.mpegurl; codecs="avc1.42E01E, mp4a.40.2"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
m3uv: { // M3U
|
|
||||||
codec: 'audio/mpegurl',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
ogv: { // OGG
|
|
||||||
codec: 'video/ogg; codecs="theora, vorbis"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
webmv: { // WEBM
|
|
||||||
codec: 'video/webm; codecs="vorbis, vp8"',
|
|
||||||
flashCanPlay: false,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
flv: { // FLV / F4V
|
|
||||||
codec: 'video/x-flv',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'video'
|
|
||||||
},
|
|
||||||
rtmpv: { // RTMP VIDEO
|
|
||||||
codec: 'video/rtmp; codecs="rtmp"',
|
|
||||||
flashCanPlay: true,
|
|
||||||
media: 'video'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
isObject = function(val) { // Basic check for Object
|
|
||||||
if(val && typeof val === 'object' && val.hasOwnProperty) {
|
|
||||||
return true;
|
|
||||||
} else {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
getMediaType = function(url) { // Function to gleam the media type from the URL
|
|
||||||
var mediaType = false;
|
|
||||||
if(/\.mp3$/i.test(url)) {
|
|
||||||
mediaType = 'mp3';
|
|
||||||
} else if(/\.mp4$/i.test(url) || /\.m4v$/i.test(url)) {
|
|
||||||
mediaType = 'm4v';
|
|
||||||
} else if(/\.m4a$/i.test(url)) {
|
|
||||||
mediaType = 'm4a';
|
|
||||||
} else if(/\.ogg$/i.test(url) || /\.oga$/i.test(url)) {
|
|
||||||
mediaType = 'oga';
|
|
||||||
} else if(/\.ogv$/i.test(url)) {
|
|
||||||
mediaType = 'ogv';
|
|
||||||
} else if(/\.webm$/i.test(url)) {
|
|
||||||
mediaType = 'webmv';
|
|
||||||
}
|
|
||||||
return mediaType;
|
|
||||||
},
|
|
||||||
getSupplied = function(url) { // Function to generate a supplied option from an src object. ie., When supplied not specified.
|
|
||||||
var supplied = '',
|
|
||||||
separator = '';
|
|
||||||
if(isObject(url)) {
|
|
||||||
// Generate supplied option from object's properties. Non-format properties would be ignored by jPlayer. Order is unpredictable.
|
|
||||||
for(var prop in url) {
|
|
||||||
if(url.hasOwnProperty(prop)) {
|
|
||||||
supplied += separator + prop;
|
|
||||||
separator = ',';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if(DEBUG) console.log('getSupplied(): Generated: supplied = "' + supplied + '"');
|
|
||||||
return supplied;
|
|
||||||
};
|
|
||||||
|
|
||||||
Popcorn.player( 'jplayer', {
|
|
||||||
_canPlayType: function( containerType, url ) {
|
|
||||||
// url : Either a String or an Object structured similar a jPlayer media object. ie., As used by setMedia in jPlayer.
|
|
||||||
// The url object may also contain a solution and supplied property.
|
|
||||||
|
|
||||||
// Define the src object structure here!
|
|
||||||
|
|
||||||
var cType = containerType.toLowerCase(),
|
|
||||||
srcObj = {
|
|
||||||
media:{},
|
|
||||||
options:{}
|
|
||||||
},
|
|
||||||
rVal = false, // Only a boolean false means it is not supported.
|
|
||||||
mediaType;
|
|
||||||
|
|
||||||
if(cType !== 'video' && cType !== 'audio') {
|
|
||||||
|
|
||||||
if(typeof url === 'string') {
|
|
||||||
// Check it starts with http, so the URL is absolute... Well, it is not a perfect check.
|
|
||||||
if(/^http.*/i.test(url)) {
|
|
||||||
mediaType = getMediaType(url);
|
|
||||||
if(mediaType) {
|
|
||||||
srcObj.media[mediaType] = url;
|
|
||||||
srcObj.options.solution = SOLUTION;
|
|
||||||
srcObj.options.supplied = mediaType;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
srcObj = url; // Assume the url is an src object.
|
|
||||||
}
|
|
||||||
|
|
||||||
// Check for Object and appropriate minimum data structure.
|
|
||||||
if(isObject(srcObj) && isObject(srcObj.media)) {
|
|
||||||
|
|
||||||
if(!isObject(srcObj.options)) {
|
|
||||||
srcObj.options = {};
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!srcObj.options.solution) {
|
|
||||||
srcObj.options.solution = SOLUTION;
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!srcObj.options.supplied) {
|
|
||||||
srcObj.options.supplied = getSupplied(srcObj.media);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Figure out how jPlayer will play it.
|
|
||||||
// This may not work properly when both audio and video is supplied. ie., A media player. But it should return truethy and jPlayer can figure it out.
|
|
||||||
|
|
||||||
var solution = srcObj.options.solution.toLowerCase().split(","), // Create the solution array, with prority based on the order of the solution string.
|
|
||||||
supplied = srcObj.options.supplied.toLowerCase().split(","); // Create the supplied formats array, with prority based on the order of the supplied formats string.
|
|
||||||
|
|
||||||
for(var sol = 0; sol < solution.length; sol++) {
|
|
||||||
|
|
||||||
var solutionType = solution[sol].replace(/^\s+|\s+$/g, ""), //trim
|
|
||||||
checkingHtml = solutionType === 'html',
|
|
||||||
checkingFlash = solutionType === 'flash',
|
|
||||||
mediaElem;
|
|
||||||
|
|
||||||
for(var fmt = 0; fmt < supplied.length; fmt++) {
|
|
||||||
mediaType = supplied[fmt].replace(/^\s+|\s+$/g, ""); //trim
|
|
||||||
if(format[mediaType]) { // Check format is valid.
|
|
||||||
|
|
||||||
// Create an HTML5 media element for the type of media.
|
|
||||||
if(!mediaElem && checkingHtml) {
|
|
||||||
mediaElem = document.createElement(format[mediaType].media);
|
|
||||||
}
|
|
||||||
// See if the HTML5 media element can play the MIME / Codec type.
|
|
||||||
// Flash also returns the object if the format is playable, so it is truethy, but that html property is false.
|
|
||||||
// This assumes Flash is available, but that should be dealt with by jPlayer if that happens.
|
|
||||||
var htmlCanPlay = !!(mediaElem && mediaElem.canPlayType && mediaElem.canPlayType(format[mediaType].codec)),
|
|
||||||
htmlWillPlay = htmlCanPlay && checkingHtml,
|
|
||||||
flashWillPlay = format[mediaType].flashCanPlay && checkingFlash;
|
|
||||||
// The first one found will match what jPlayer uses.
|
|
||||||
if(htmlWillPlay || flashWillPlay) {
|
|
||||||
rVal = {
|
|
||||||
html: htmlWillPlay,
|
|
||||||
type: mediaType
|
|
||||||
};
|
|
||||||
sol = solution.length; // Exit solution loop
|
|
||||||
fmt = supplied.length; // Exit supplied loop
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return rVal;
|
|
||||||
},
|
|
||||||
// _setup: function( options ) { // Warning: options is deprecated.
|
|
||||||
_setup: function() {
|
|
||||||
var media = this,
|
|
||||||
myPlayer, // The jQuery selector of the jPlayer element. Usually a <div>
|
|
||||||
jPlayerObj, // The jPlayer data instance. For performance and DRY code.
|
|
||||||
mediaType = 'unknown',
|
|
||||||
jpMedia = {},
|
|
||||||
jpOptions = {},
|
|
||||||
ready = false, // Used during init to override the annoying duration dependance in the track event padding during Popcorn's isReady(). ie., We is ready after loadeddata and duration can then be set real value at leisure.
|
|
||||||
duration = 0, // For the durationchange event with both HTML5 and Flash solutions. Used with 'ready' to keep control during the Popcorn isReady() via loadeddata event. (Duration=0 is bad.)
|
|
||||||
durationchangeId = null, // A timeout ID used with delayed durationchange event. (Because of the duration=NaN fudge to avoid Popcorn track event corruption.)
|
|
||||||
canplaythrough = false,
|
|
||||||
error = null, // The MediaError object.
|
|
||||||
|
|
||||||
dispatchDurationChange = function() {
|
|
||||||
if(ready) {
|
|
||||||
if(DEBUG) console.log('Dispatched event : durationchange : ' + duration);
|
|
||||||
media.dispatchEvent('durationchange');
|
|
||||||
} else {
|
|
||||||
if(DEBUG) console.log('DELAYED EVENT (!ready) : durationchange : ' + duration);
|
|
||||||
clearTimeout(durationchangeId); // Stop multiple triggers causing multiple timeouts running in parallel.
|
|
||||||
durationchangeId = setTimeout(dispatchDurationChange, 250);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
jPlayerFlashEventsPatch = function() {
|
|
||||||
|
|
||||||
/* Events already supported by jPlayer Flash:
|
|
||||||
* loadstart
|
|
||||||
* loadedmetadata (M4A, M4V)
|
|
||||||
* progress
|
|
||||||
* play
|
|
||||||
* pause
|
|
||||||
* seeking
|
|
||||||
* seeked
|
|
||||||
* timeupdate
|
|
||||||
* ended
|
|
||||||
* volumechange
|
|
||||||
* error <- See the custom handler in jPlayerInit()
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Events patched:
|
|
||||||
* loadeddata
|
|
||||||
* durationchange
|
|
||||||
* canplaythrough
|
|
||||||
* playing
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* Events NOT patched:
|
|
||||||
* suspend
|
|
||||||
* abort
|
|
||||||
* emptied
|
|
||||||
* stalled
|
|
||||||
* loadedmetadata (MP3)
|
|
||||||
* waiting
|
|
||||||
* canplay
|
|
||||||
* ratechange
|
|
||||||
*/
|
|
||||||
|
|
||||||
// Triggering patched events through the jPlayer Object so the events are homogeneous. ie., The contain the event.jPlayer data structure.
|
|
||||||
|
|
||||||
var checkDuration = function(event) {
|
|
||||||
if(event.jPlayer.status.duration !== duration) {
|
|
||||||
duration = event.jPlayer.status.duration;
|
|
||||||
dispatchDurationChange();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
checkCanPlayThrough = function(event) {
|
|
||||||
if(!canplaythrough && event.jPlayer.status.seekPercent === 100) {
|
|
||||||
canplaythrough = true;
|
|
||||||
setTimeout(function() {
|
|
||||||
if(DEBUG) console.log('Trigger : canplaythrough');
|
|
||||||
jPlayerObj._trigger($.jPlayer.event.canplaythrough);
|
|
||||||
}, 0);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.loadstart, function() {
|
|
||||||
setTimeout(function() {
|
|
||||||
if(DEBUG) console.log('Trigger : loadeddata');
|
|
||||||
jPlayerObj._trigger($.jPlayer.event.loadeddata);
|
|
||||||
}, 0);
|
|
||||||
})
|
|
||||||
.bind($.jPlayer.event.progress, function(event) {
|
|
||||||
checkDuration(event);
|
|
||||||
checkCanPlayThrough(event);
|
|
||||||
})
|
|
||||||
.bind($.jPlayer.event.timeupdate, function(event) {
|
|
||||||
checkDuration(event);
|
|
||||||
checkCanPlayThrough(event);
|
|
||||||
})
|
|
||||||
.bind($.jPlayer.event.play, function() {
|
|
||||||
setTimeout(function() {
|
|
||||||
if(DEBUG) console.log('Trigger : playing');
|
|
||||||
jPlayerObj._trigger($.jPlayer.event.playing);
|
|
||||||
}, 0);
|
|
||||||
});
|
|
||||||
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handlers for FLASH');
|
|
||||||
},
|
|
||||||
|
|
||||||
jPlayerInit = function() {
|
|
||||||
(function($) {
|
|
||||||
|
|
||||||
myPlayer = $('#' + media.id);
|
|
||||||
|
|
||||||
if(typeof media.src === 'string') {
|
|
||||||
mediaType = getMediaType(media.src);
|
|
||||||
jpMedia[mediaType] = media.src;
|
|
||||||
jpOptions.supplied = mediaType;
|
|
||||||
jpOptions.solution = SOLUTION;
|
|
||||||
} else if(isObject(media.src)) {
|
|
||||||
jpMedia = isObject(media.src.media) ? media.src.media : {};
|
|
||||||
jpOptions = isObject(media.src.options) ? media.src.options : {};
|
|
||||||
jpOptions.solution = jpOptions.solution || SOLUTION;
|
|
||||||
jpOptions.supplied = jpOptions.supplied || getSupplied(media.src.media);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Allow the swfPath to be set to local server. ie., If the jPlayer Plugin is local and already on the page, then you can also use the local SWF.
|
|
||||||
jpOptions.swfPath = jpOptions.swfPath || JPLAYER_SWFPATH;
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.ready, function(event) {
|
|
||||||
if(event.jPlayer.flash.used) {
|
|
||||||
jPlayerFlashEventsPatch();
|
|
||||||
}
|
|
||||||
// Set the media andd load it, so that the Flash solution behaves similar to HTML5 solution.
|
|
||||||
// This also allows the loadstart event to be used to know jPlayer is ready.
|
|
||||||
$(this).jPlayer('setMedia', jpMedia).jPlayer('load');
|
|
||||||
});
|
|
||||||
|
|
||||||
// Do not auto-bubble the reserved events, nor the loadeddata and durationchange event, since the duration must be carefully handled when loadeddata event occurs.
|
|
||||||
// See the duration property code for more details. (Ranting.)
|
|
||||||
|
|
||||||
var reservedEvents = $.jPlayer.reservedEvent + ' loadeddata durationchange',
|
|
||||||
reservedEvent = reservedEvents.split(/\s+/g);
|
|
||||||
|
|
||||||
// Generate event handlers for all the standard HTML5 media events. (Except durationchange)
|
|
||||||
|
|
||||||
var bindEvent = function(name) {
|
|
||||||
myPlayer.bind($.jPlayer.event[name], function(event) {
|
|
||||||
if(DEBUG) console.log('Dispatched event: ' + name + (event && event.jPlayer ? ' (' + event.jPlayer.status.currentTime + 's)' : '')); // Must be after dispatch for some reason on Firefox/Opera
|
|
||||||
media.dispatchEvent(name);
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created event handler for: ' + name);
|
|
||||||
};
|
|
||||||
|
|
||||||
for(var eventName in $.jPlayer.event) {
|
|
||||||
if($.jPlayer.event.hasOwnProperty(eventName)) {
|
|
||||||
var nativeEvent = true;
|
|
||||||
for(var iRes in reservedEvent) {
|
|
||||||
if(reservedEvent.hasOwnProperty(iRes)) {
|
|
||||||
if(reservedEvent[iRes] === eventName) {
|
|
||||||
nativeEvent = false;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if(nativeEvent) {
|
|
||||||
bindEvent(eventName);
|
|
||||||
} else {
|
|
||||||
if(DEBUG) console.log('Skipped auto event handler creation for: ' + eventName);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.loadeddata, function(event) {
|
|
||||||
if(DEBUG) console.log('Dispatched event: loadeddata' + (event && event.jPlayer ? ' (' + event.jPlayer.status.currentTime + 's)' : ''));
|
|
||||||
media.dispatchEvent('loadeddata');
|
|
||||||
ready = true;
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handler for: loadeddata');
|
|
||||||
|
|
||||||
myPlayer.bind($.jPlayer.event.durationchange, function(event) {
|
|
||||||
duration = event.jPlayer.status.duration;
|
|
||||||
dispatchDurationChange();
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handler for: durationchange');
|
|
||||||
|
|
||||||
// The error event is a special case. Plus jPlayer error event assumes it is a broken URL. (It could also be a decoder error... Or aborted or a Network error.)
|
|
||||||
myPlayer.bind($.jPlayer.event.error, function(event) {
|
|
||||||
// Not sure how to handle the error situation. Popcorn does not appear to have the error or error.code property documented here: http://popcornjs.org/popcorn-docs/media-methods/
|
|
||||||
// If any error event happens, then something has gone pear shaped.
|
|
||||||
|
|
||||||
error = event.jPlayer.error; // Saving object pointer, not a copy of the object. Possible garbage collection issue... But the player is dead anyway, so don't care.
|
|
||||||
|
|
||||||
if(error.type === $.jPlayer.error.URL) {
|
|
||||||
error.code = 4; // MEDIA_ERR_SRC_NOT_SUPPORTED since jPlayer makes this assumption. It is the most common error, then the decode error. Never seen either of the other 2 error types occur.
|
|
||||||
} else {
|
|
||||||
error.code = 0; // It was a jPlayer error, not an HTML5 media error.
|
|
||||||
}
|
|
||||||
|
|
||||||
if(DEBUG) console.log('Dispatched event: error');
|
|
||||||
if(DEBUG) console.dir(error);
|
|
||||||
media.dispatchEvent('error');
|
|
||||||
});
|
|
||||||
if(DEBUG) console.log('Created CUSTOM event handler for: error');
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'error', {
|
|
||||||
set: function() {
|
|
||||||
// Read-only property
|
|
||||||
return error;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return error;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'currentTime', {
|
|
||||||
set: function( val ) {
|
|
||||||
if(jPlayerObj.status.paused) {
|
|
||||||
myPlayer.jPlayer('pause', val);
|
|
||||||
} else {
|
|
||||||
myPlayer.jPlayer('play', val);
|
|
||||||
}
|
|
||||||
return val;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.status.currentTime;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
/* The joy of duration and the loadeddata event isReady() handler
|
|
||||||
* The duration is assumed to be a NaN or a valid duration.
|
|
||||||
* jPlayer uses zero instead of a NaN and this screws up the Popcorn track event start/end arrays padding.
|
|
||||||
* This line here:
|
|
||||||
* videoDurationPlus = duration != duration ? Number.MAX_VALUE : duration + 1;
|
|
||||||
* Not sure why it is not simply:
|
|
||||||
* videoDurationPlus = Number.MAX_VALUE; // Who cares if the padding is close to the real duration?
|
|
||||||
* So if you trigger loadeddata before the duration is correct, the track event padding is screwed up. (It pads the start, not the end... Well, duration+1 = 0+1 = 1s)
|
|
||||||
* That line makes the MP3 Flash fallback difficult to setup. The whole MP3 will need to load before the duration is known.
|
|
||||||
* Planning on using a NaN for duration until a >0 value is found... Except with MP3, where seekPercent must be 100% before setting the duration.
|
|
||||||
* Why not just use a NaN during init... And then correct the duration later?
|
|
||||||
*/
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'duration', {
|
|
||||||
set: function() {
|
|
||||||
// Read-only property
|
|
||||||
if(ready) {
|
|
||||||
return duration;
|
|
||||||
} else {
|
|
||||||
return NaN;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
if(ready) {
|
|
||||||
return duration; // Popcorn has initialized, we can now use duration zero or whatever without fear.
|
|
||||||
} else {
|
|
||||||
return NaN; // Keep the duration a NaN until after loadeddata event has occurred. Otherwise Popcorn track event padding is corrupted.
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'muted', {
|
|
||||||
set: function( val ) {
|
|
||||||
myPlayer.jPlayer('mute', val);
|
|
||||||
return jPlayerObj.options.muted;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.options.muted;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'volume', {
|
|
||||||
set: function( val ) {
|
|
||||||
myPlayer.jPlayer('volume', val);
|
|
||||||
return jPlayerObj.options.volume;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.options.volume;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
Popcorn.player.defineProperty( media, 'paused', {
|
|
||||||
set: function() {
|
|
||||||
// Read-only property
|
|
||||||
return jPlayerObj.status.paused;
|
|
||||||
},
|
|
||||||
get: function() {
|
|
||||||
return jPlayerObj.status.paused;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
media.play = function() {
|
|
||||||
myPlayer.jPlayer('play');
|
|
||||||
};
|
|
||||||
media.pause = function() {
|
|
||||||
myPlayer.jPlayer('pause');
|
|
||||||
};
|
|
||||||
|
|
||||||
myPlayer.jPlayer(jpOptions); // Instance jPlayer. Note that the options should not have a ready event defined... Kill it by default?
|
|
||||||
jPlayerObj = myPlayer.data('jPlayer');
|
|
||||||
|
|
||||||
}(jQuery));
|
|
||||||
},
|
|
||||||
|
|
||||||
jPlayerCheck = function() {
|
|
||||||
if (!jQuery.jPlayer) {
|
|
||||||
if (!jPlayerDownloading) {
|
|
||||||
jPlayerDownloading = true;
|
|
||||||
Popcorn.getScript(JPLAYER_SCRIPT, function() {
|
|
||||||
jPlayerDownloading = false;
|
|
||||||
jPlayerInit();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setTimeout(jPlayerCheck, 250);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
jPlayerInit();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
jQueryCheck = function() {
|
|
||||||
if (!window.jQuery) {
|
|
||||||
if (!jQueryDownloading) {
|
|
||||||
jQueryDownloading = true;
|
|
||||||
Popcorn.getScript(JQUERY_SCRIPT, function() {
|
|
||||||
jQueryDownloading = false;
|
|
||||||
jPlayerCheck();
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
setTimeout(jQueryCheck, 250);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
jPlayerCheck();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
jQueryCheck();
|
|
||||||
},
|
|
||||||
_teardown: function() {
|
|
||||||
jQuery('#' + this.id).jPlayer('destroy');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
}(Popcorn));
|
|
||||||
2
10.大屏音乐/js/jquery.js
vendored
2
10.大屏音乐/js/jquery.js
vendored
File diff suppressed because one or more lines are too long
6
10.大屏音乐/js/jquery.min.js
vendored
6
10.大屏音乐/js/jquery.min.js
vendored
File diff suppressed because one or more lines are too long
@ -1,6 +0,0 @@
|
|||||||
$(document).ready(function () {
|
|
||||||
setTimeout(function () {
|
|
||||||
$("#grid").hide();
|
|
||||||
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
@ -1,38 +0,0 @@
|
|||||||
const playAll = true;
|
|
||||||
|
|
||||||
const cols = 3;
|
|
||||||
const gridEl = document.getElementById('grid');
|
|
||||||
const gridW = window.innerWidth;
|
|
||||||
const gridH = window.innerHeight;
|
|
||||||
|
|
||||||
const SETTINGS = [
|
|
||||||
|
|
||||||
{
|
|
||||||
instances: {
|
|
||||||
spring: null,
|
|
||||||
spinner: null
|
|
||||||
},
|
|
||||||
rebound: {
|
|
||||||
tension: 10,
|
|
||||||
friction: 19
|
|
||||||
},
|
|
||||||
spinner: {
|
|
||||||
canvasW: gridW,
|
|
||||||
canvasH: gridH,
|
|
||||||
radius: 100,
|
|
||||||
sides: 4, // The number of edges.
|
|
||||||
depth: 30,
|
|
||||||
colors: {
|
|
||||||
background: '#fff0',
|
|
||||||
stroke: '#f0f0f0',
|
|
||||||
base: "null",
|
|
||||||
child: '#ec4141'
|
|
||||||
},
|
|
||||||
alwaysForward: true, // When false the spring will reverse normally.
|
|
||||||
restAt: 0.8, // A number from 0.1 to 0.9 || null for full rotation
|
|
||||||
renderBase: true // Optionally render basePolygon
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
];
|
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,653 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en" class="app">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<title>Musik | Web Application</title>
|
|
||||||
<meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav"/>
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
|
|
||||||
|
|
||||||
<link rel="shortcut icon" href="images/logo/favicon.ico" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/animate.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/app.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/simple-line-icons.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="js/jPlayer/jplayer.flat.css" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/beforeafter-content.css" media="screen" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/beforeafter-settings.css" media="screen" />
|
|
||||||
|
|
||||||
<script type="text/javascript" src="js/jquery.js"></script>
|
|
||||||
<script type="text/javascript" src="js/freshline/jquery.freshline.beforeafter.js"></script>
|
|
||||||
<script type="text/javascript" src="js/freshline/animadrag.js"></script>
|
|
||||||
<!--[if lt IE 9]>
|
|
||||||
<script src="js/ie/html5shiv.js"></script>
|
|
||||||
<script src="js/ie/respond.min.js"></script>
|
|
||||||
<script src="js/ie/excanvas.js"></script>
|
|
||||||
<![endif]-->
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
<section class="vbox">
|
|
||||||
<header class="bg-black lter header header-md navbar navbar-fixed-top-xs">
|
|
||||||
<ul class="nav navbar-nav hidden-xs">
|
|
||||||
<li>
|
|
||||||
<a href="#" class="text-muted">
|
|
||||||
<i class="fa fa-indent text"></i>
|
|
||||||
<i class="fa fa-dedent text-active"></i>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<form class="navbar-form navbar-left input-s-lg m-t m-l-n-xs hidden-xs" role="search">
|
|
||||||
<div class="form-group">
|
|
||||||
<div class="input-group">
|
|
||||||
<span class="input-group-btn">
|
|
||||||
<button type="submit" class="btn btn-sm bg-white btn-icon rounded"><i class="fa fa-search"></i></button>
|
|
||||||
</span>
|
|
||||||
<input type="text" class="form-control input-sm no-border rounded" placeholder="Search songs, albums...">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<section>
|
|
||||||
<section class="hbox stretch">
|
|
||||||
<section id="content">
|
|
||||||
<section class="vbox">
|
|
||||||
<section class="w-f-md">
|
|
||||||
<section class="hbox stretch bg-black dker">
|
|
||||||
<!-- side content -->
|
|
||||||
<aside class="col-sm-5 no-padder" id="sidebar">
|
|
||||||
<section class="vbox animated fadeInUp">
|
|
||||||
<section class="scrollable">
|
|
||||||
<div class="m-t-n-xxs item pos-rlt">
|
|
||||||
<div class="top text-right">
|
|
||||||
<span class="musicbar bg-success bg-empty inline m-r-lg m-t" style="width:25px;height:30px">
|
|
||||||
<span class="bar1 a3 lter"></span>
|
|
||||||
<span class="bar2 a5 lt"></span>
|
|
||||||
<span class="bar3 a1 bg"></span>
|
|
||||||
<span class="bar4 a4 dk"></span>
|
|
||||||
<span class="bar5 a2 dker"></span>
|
|
||||||
<span class="bar6 a6"></span>
|
|
||||||
<span class="bar7 a7"></span>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="bottom gd bg-info wrapper-lg">
|
|
||||||
<span class="pull-right text-sm">101,400 <br>Followers</span>
|
|
||||||
<span class="h2 font-thin">Soph Ashe</span>
|
|
||||||
</div>
|
|
||||||
<div id="example3" class="beforeafter_slider_3" style="overflow:hidden; width:100%;height:200px">
|
|
||||||
<ul>
|
|
||||||
<li><img src="images/beforeafter_3/316253jas.jpg" alt="images/beforeafter_3/316253jas.jpg" />
|
|
||||||
<div id="textbox_13">
|
|
||||||
<div id="logo_13" class="fadeleft"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_13" class="before">
|
|
||||||
<div id="title_13" class="fadeup">Start in my life</div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_13" class="after">
|
|
||||||
<div id="title_13" class="fadeup">Feel Fine! </div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_13b" class="after">
|
|
||||||
<div id="title_13b" class="fadeup"><i>Make my day</i></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_13c" class="after">
|
|
||||||
<div id="title_13c" class="fadeup"><i>kami,my opp</i></div>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li><img src="images/beforeafter_3/315989.jpg" alt="images/beforeafter_3/315989.jpg" />
|
|
||||||
<div id="textbox_code" class="after">
|
|
||||||
<div id="code" class="fadeup"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_green" class="before">
|
|
||||||
<div id="green" class="fadeleft"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_green2" class="after">
|
|
||||||
<div id="green2" class="fade"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_fish">
|
|
||||||
<div id="fish" class="fadedown"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_points" class="after">
|
|
||||||
<div id="points" class="faderight"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_points" class="after">
|
|
||||||
<div id="points" class="faderight"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_points" class="before">
|
|
||||||
<div id="points" class="faderight"></div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_14c" class="after">
|
|
||||||
<div id="title_14c" class="fadeup">We are</div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_14a" class="after">
|
|
||||||
<div id="title_14" class="fadeup">freshline</div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_14b" class="before">
|
|
||||||
<div id="title_14" class="fadeup">fresh</div>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li><img src="images/beforeafter_3/317838.jpg" alt="images/beforeafter_3/317838.jpg" />
|
|
||||||
<div id="textbox_11" class="before">
|
|
||||||
<div id="title_11" class="fadeup">Maybe uoti?</div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_11" class="after">
|
|
||||||
<div id="title_11" class="fadeup">No, Saber!</div>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li><img src="images/beforeafter_3/318074.jpg" alt="images/beforeafter_3/318074.jpg" />
|
|
||||||
<div id="textbox_12" class="before">
|
|
||||||
<div id="title_12" class="fadeup">Baby Aupair</div>
|
|
||||||
</div>
|
|
||||||
<div id="textbox_12" class="after">
|
|
||||||
<div id="title_12" class="fadeup">No Guarantee!</div>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<ul class=" list-group list-group-lg radius no-border no-bg m-t-n-xxs m-b-none auto" id="latest">
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div id="hoveraudio" class=" clear text-ellipsis">
|
|
||||||
<span>The wheel of fortune</span>
|
|
||||||
<span class="text-muted"> -- 03:30</span>
|
|
||||||
</div>
|
|
||||||
<div class="music-jump"></div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>you are my king</span>
|
|
||||||
<span class="text-muted"> -- 02:37</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>初恋的小美好</span>
|
|
||||||
<span class="text-muted"> -- 03:59</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>Lilac</span>
|
|
||||||
<span class="text-muted"> -- 04:38</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span> 一人静</span>
|
|
||||||
<span class="text-muted"> -- 04:38</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>Through My Blood</span>
|
|
||||||
<span class="text-muted"> -- 04:04</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>Too Late To Say</span>
|
|
||||||
<span class="text-muted"> -- 05:15</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>琥珀色の海へ</span>
|
|
||||||
<span class="text-muted"> -- 03:21</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>からくりピエロ (instrumental)</span>
|
|
||||||
<span class="text-muted"> -- 04:52</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>M04</span>
|
|
||||||
<span class="text-muted"> -- 02:21</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>M35</span>
|
|
||||||
<span class="text-muted"> -- 01:35</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>哈尔的移动城堡</span>
|
|
||||||
<span class="text-muted"> -- 02:22</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>流れ星</span>
|
|
||||||
<span class="text-muted"> -- 01:37</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>Memories</span>
|
|
||||||
<span class="text-muted"> -- 05:15</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>それがあなたの幸せとしても</span>
|
|
||||||
<span class="text-muted"> -- 04:29</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>Angel</span>
|
|
||||||
<span class="text-muted"> -- 04:35</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>兰若词</span>
|
|
||||||
<span class="text-muted"> -- 04:35</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item">
|
|
||||||
<a href="#" class="jp-play-me m-r-sm pull-left">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<div class="clear text-ellipsis">
|
|
||||||
<span>Pieces Of My Words-言の花-</span>
|
|
||||||
<span class="text-muted"> -- 03:54</span>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</aside>
|
|
||||||
|
|
||||||
<section class="col-sm-4 no-padder bg">
|
|
||||||
<section class="vbox">
|
|
||||||
<section class="scrollable hover">
|
|
||||||
<ul class="list-group list-group-lg no-bg auto m-b-none m-t-n-xxs">
|
|
||||||
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/m0.jpg" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Little Town</span>
|
|
||||||
<small class="text-muted">by Soph Ashe</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a1.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Get lacinia odio sem nec elit</span>
|
|
||||||
<small class="text-muted">by Filex</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a2.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Donec sed odio du</span>
|
|
||||||
<small class="text-muted">by Dan Doorack</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/logo/portrait.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Curabitur blandit tempu</span>
|
|
||||||
<small class="text-muted">by Foxes</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a4.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Urna mollis ornare vel eu leo</span>
|
|
||||||
<small class="text-muted">by Chris Fox</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a5.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Faucibus dolor auctor</span>
|
|
||||||
<small class="text-muted">by Lauren Taylor</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a6.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Praesent commodo cursus magn</span>
|
|
||||||
<small class="text-muted">by Chris Fox</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a7.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Vestibulum id</span>
|
|
||||||
<small class="text-muted">by Milian</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a8.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Blandit tempu</span>
|
|
||||||
<small class="text-muted">by Amanda Conlan</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a9.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Vestibulum ullamcorpe quis malesuada augue mco rpe</span>
|
|
||||||
<small class="text-muted">by Dan Doorack</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a12.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Natis ipsum ac feugiat</span>
|
|
||||||
<small class="text-muted">by Hamburg</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
<li class="list-group-item clearfix">
|
|
||||||
<a href="#" class="jp-play-fun pull-right m-t-sm m-l text-md">
|
|
||||||
<i class="icon-control-play text"></i>
|
|
||||||
<i class="icon-control-pause text-active"></i>
|
|
||||||
</a>
|
|
||||||
<a href="#" class="pull-left thumb-sm m-r">
|
|
||||||
<img src="images/a0.png" alt="...">
|
|
||||||
</a>
|
|
||||||
<a class="clear" href="#">
|
|
||||||
<span class="block text-ellipsis">Sec condimentum au</span>
|
|
||||||
<small class="text-muted">by Amanda Conlan</small>
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
<section class="col-sm-3 no-padder lt">
|
|
||||||
<section class="vbox">
|
|
||||||
<section class="scrollable hover">
|
|
||||||
<div class="m-t-n-xxs">
|
|
||||||
<div class="item pos-rlt">
|
|
||||||
<a href="#" class="item-overlay active opacity wrapper-md font-xs">
|
|
||||||
<span class="block h3 font-bold text-info">Search</span>
|
|
||||||
<span class="text-muted">Search the music you like</span>
|
|
||||||
<span class="bottom wrapper-md block"> <i class="icon-arrow-right i-lg pull-right"></i></span>
|
|
||||||
</a>
|
|
||||||
<a href="#">
|
|
||||||
<img class="img-full" src="images/314601.jpg" alt="...">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="item pos-rlt">
|
|
||||||
<a href="#" class="item-overlay active opacity wrapper-md font-xs text-right">
|
|
||||||
<span class="block h3 font-bold text-warning text-u-c">Listen</span>
|
|
||||||
<span class="text-muted">Find the peace in your heart</span>
|
|
||||||
<span class="bottom wrapper-md block"><i class="icon-arrow-right i-lg pull-left"></i> </span>
|
|
||||||
</a>
|
|
||||||
<a href="#">
|
|
||||||
<img class="img-full" src="images/316718.jpg" alt="...">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="item pos-rlt">
|
|
||||||
<a href="#" class="item-overlay active opacity wrapper-md font-xs">
|
|
||||||
<span class="block h3 font-bold text-success text-u-c">Share</span>
|
|
||||||
<span class="text-muted">Share the good songs with your loves</span>
|
|
||||||
<span class="bottom wrapper-md block"> <i class="icon-arrow-right i-lg pull-right"></i></span>
|
|
||||||
</a>
|
|
||||||
<a href="#">
|
|
||||||
<img class="img-full" src="images/317839.jpg" alt="...">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="item pos-rlt">
|
|
||||||
<a href="#" class="item-overlay active opacity wrapper-md font-xs text-right">
|
|
||||||
<span class="block h3 font-bold text-white text-u-c">Show</span>
|
|
||||||
<span class="text-muted">Find, Listen & Share</span>
|
|
||||||
<span class="bottom wrapper-md block"><i class="icon-arrow-right i-lg pull-left"></i> </span>
|
|
||||||
</a>
|
|
||||||
<a href="#">
|
|
||||||
<img class="img-full" src="images/318897.jpg" alt="...">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<div class="item pos-rlt">
|
|
||||||
<a href="#" class="item-overlay active opacity wrapper-md font-xs">
|
|
||||||
<span class="block h3 font-bold text-danger-lter text-u-c">Feeling</span>
|
|
||||||
<span class="text-muted">Selected songs</span>
|
|
||||||
<span class="bottom wrapper-md block"> <i class="icon-arrow-right i-lg pull-right"></i></span>
|
|
||||||
</a>
|
|
||||||
<a href="#">
|
|
||||||
<img class="img-full" src="images/318334.jpg" alt="...">
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
<footer class="footer bg-success dker">
|
|
||||||
<div id="jp_container_N">
|
|
||||||
<div class="jp-type-playlist">
|
|
||||||
<div id="jplayer_N" class="jp-jplayer hide"></div>
|
|
||||||
<div class="jp-gui">
|
|
||||||
<div class="jp-video-play hide">
|
|
||||||
<a class="jp-video-play-icon">play</a>
|
|
||||||
</div>
|
|
||||||
<div class="jp-interface">
|
|
||||||
<div class="jp-controls">
|
|
||||||
<div><a class="jp-previous"><i class="icon-control-rewind i-lg"></i></a></div>
|
|
||||||
<div>
|
|
||||||
<a class="jp-play"><i class="icon-control-play i-2x"></i></a>
|
|
||||||
<a class="jp-pause hid"><i class="icon-control-pause i-2x"></i></a>
|
|
||||||
</div>
|
|
||||||
<div><a class="jp-next"><i class="icon-control-forward i-lg"></i></a></div>
|
|
||||||
<div class="hide"><a class="jp-stop"><i class="fa fa-stop"></i></a></div>
|
|
||||||
<div>
|
|
||||||
<a class="" data-toggle="dropdown" data-target="#playlist">
|
|
||||||
<i class="icon-playlist"></i></a>
|
|
||||||
</div>
|
|
||||||
<div><img id="poster-ty" class="poster-img" src="images/a10.png"></div>
|
|
||||||
<div class="jp-progress hidden-xs">
|
|
||||||
<div class="jp-seek-bar dk">
|
|
||||||
<div class="jp-play-bar bg">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="jp-title text-lt">
|
|
||||||
<ul>
|
|
||||||
<li></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="hidden-xs hidden-sm jp-current-time text-xs text-muted"></div>
|
|
||||||
<div class="hidden-xs hidden-sm jp-duration text-xs text-muted"></div>
|
|
||||||
<div class="hidden-xs hidden-sm">
|
|
||||||
<a class="jp-mute" title="mute"><i class="icon-volume-2"></i></a>
|
|
||||||
<a class="jp-unmute hid" title="unmute"><i class="icon-volume-off"></i></a>
|
|
||||||
</div>
|
|
||||||
<div class="hidden-xs hidden-sm jp-volume">
|
|
||||||
<div class="jp-volume-bar dk volume-bor">
|
|
||||||
<div class="jp-volume-bar-value lter "></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<a class="jp-shuffle" title="shuffle"><i class="icon-shuffle text-muted"></i></a>
|
|
||||||
<a class="jp-shuffle-off hid" title="shuffle off"><i class="icon-shuffle text-lt"></i></a>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<a class="jp-repeat" title="repeat"><i class="icon-loop text-muted"></i></a>
|
|
||||||
<a class="jp-repeat-off hid" title="repeat off"><i class="icon-loop text-lt"></i></a>
|
|
||||||
</div>
|
|
||||||
<div class="hide">
|
|
||||||
<a class="jp-full-screen" title="full screen"><i class="fa fa-expand"></i></a>
|
|
||||||
<a class="jp-restore-screen" title="restore screen"><i class="fa fa-compress text-lt"></i></a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="jp-playlist dropup" id="playlist">
|
|
||||||
<ul class="dropdown-menu aside-xl dker">
|
|
||||||
<!-- The method Playlist.displayPlaylist() uses this unordered list -->
|
|
||||||
<li class="list-group-item"></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="jp-no-solution hide">
|
|
||||||
<span>Update Required</span> To play the media you will need to either update your browser to a recent
|
|
||||||
version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
<a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen,open" data-target="#nav,html"></a>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<script src="js/bootstrap.js"></script>
|
|
||||||
<script type="text/javascript" src="js/example.js"></script>
|
|
||||||
<script src="js/app.js"></script>
|
|
||||||
<script src="js/app.plugin.js"></script>
|
|
||||||
<script type="text/javascript" src="js/jPlayer/jquery.jplayer.min.js"></script>
|
|
||||||
<script type="text/javascript" src="js/jPlayer/add-on/jplayer.playlist.min.js"></script>
|
|
||||||
<script type="text/javascript" src="js/jPlayer/demo.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Loading…
x
Reference in New Issue
Block a user