:art:优化整体架构
@@ -29,7 +29,6 @@ public class OriginFilter {
|
||||
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
|
||||
CorsConfiguration corsConfiguration = new CorsConfiguration();
|
||||
corsConfiguration.setAllowCredentials(true);
|
||||
// corsConfiguration.setAllowedOriginPatterns(Collections.singletonList(allowedOrigins.replace(" ", "")));
|
||||
corsConfiguration.setAllowedOriginPatterns(Collections.singletonList(CorsConfiguration.ALL));
|
||||
corsConfiguration.setAllowedHeaders(Collections.singletonList(CorsConfiguration.ALL));
|
||||
corsConfiguration.setAllowedMethods(Collections.singletonList(CorsConfiguration.ALL));
|
||||
@@ -42,28 +41,3 @@ public class OriginFilter {
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
//@Configuration
|
||||
//public class OriginFilter implements WebMvcConfigurer {
|
||||
//
|
||||
// @Value("${CROS_ALLOWED_ORIGINS}")
|
||||
// private String allowedOrigins;
|
||||
//
|
||||
// @Override
|
||||
// public void addCorsMappings(CorsRegistry registry) {
|
||||
// // 允许跨域访问的路径
|
||||
// registry.addMapping("/**")
|
||||
// // 允许跨域访问的源
|
||||
// .allowedOrigins("http://服务器Ip:9528","http://服务器Ip:9001")
|
||||
// // 允许请求方法
|
||||
// .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
|
||||
// // 预检间隔时间
|
||||
// .maxAge(168000)
|
||||
// // 允许头部设置
|
||||
// .allowedHeaders("*")
|
||||
// // 是否发送cookie
|
||||
// .allowCredentials(true);
|
||||
// }
|
||||
//
|
||||
//}
|
||||
@@ -43,17 +43,14 @@ public class ShiroConfig {
|
||||
|
||||
}
|
||||
|
||||
//安全对象
|
||||
@Bean
|
||||
public DefaultWebSecurityManager defaultWebSecurityManager(@Qualifier("userRealm") UserRealm userRealm){
|
||||
DefaultWebSecurityManager defaultWebSecurityManager = new DefaultWebSecurityManager();
|
||||
//关联UserRealm
|
||||
defaultWebSecurityManager.setRealm(userRealm);
|
||||
defaultWebSecurityManager.setRememberMeManager(null);
|
||||
return defaultWebSecurityManager;
|
||||
}
|
||||
|
||||
//创建 realm 对象
|
||||
@Bean(name = "userRealm")
|
||||
public UserRealm userRealm(){
|
||||
return new UserRealm();
|
||||
|
||||
@@ -25,7 +25,6 @@ public class UserRealm extends AuthorizingRealm {
|
||||
@Autowired
|
||||
private UserService userService;
|
||||
|
||||
//授权
|
||||
@Override
|
||||
protected AuthorizationInfo doGetAuthorizationInfo(PrincipalCollection principalCollection) {
|
||||
SimpleAuthorizationInfo info = new SimpleAuthorizationInfo();
|
||||
|
||||
@@ -22,9 +22,7 @@ public class JWTUtil {
|
||||
private static String EXPIRE_TIME = "";
|
||||
private static String SECRET = "www.hellohao.cn";
|
||||
|
||||
//生成Token
|
||||
public static String createToken(User user){
|
||||
// Date date = new Date(System.currentTimeMillis() + EXPIRE_TIME);
|
||||
Calendar calendar = Calendar.getInstance();
|
||||
calendar.add(Calendar.SECOND,604800 );//单位秒,604800 为7天
|
||||
Algorithm algorithm = Algorithm.HMAC256(SECRET);
|
||||
@@ -33,14 +31,11 @@ public class JWTUtil {
|
||||
.withClaim("username", user.getUsername())
|
||||
.withClaim("uid", user.getUid())
|
||||
.withClaim("password", user.getPassword())
|
||||
//到期时间
|
||||
.withExpiresAt(calendar.getTime())
|
||||
//创建一个新的JWT,并使用给定的算法进行标记
|
||||
.sign(algorithm);
|
||||
return token;
|
||||
}
|
||||
|
||||
//验证Token
|
||||
public static JSONObject checkToken(String token){
|
||||
JWTVerifier jwtVerifier = JWT.require(Algorithm.HMAC256(SECRET)).build();//验证对象
|
||||
JSONObject jsonObject = new JSONObject();
|
||||
@@ -68,13 +63,5 @@ public class JWTUtil {
|
||||
}
|
||||
|
||||
|
||||
public static void main(String[] args) {
|
||||
User user = new User();
|
||||
user.setEmail("Hellohao@qq.com");
|
||||
user.setUsername("Hellohao");
|
||||
String token = createToken(user);
|
||||
System.out.println(token);
|
||||
checkToken(token);
|
||||
// checkToken("eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MjM3NDYwOTUsImVtYWlsIjoiSGVsbG9oYW9AcXEuY29tIiwidXNlcm5hbWUiOiJIZWxsb2hhbyJ9.sFnAq1VU0wuiowaTtgJNNkMzRHPmRg4leNguhh0OMCA");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -14,10 +14,8 @@ import org.apache.shiro.SecurityUtils;
|
||||
import org.apache.shiro.subject.Subject;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.ui.Model;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
|
||||
import javax.servlet.http.HttpSession;
|
||||
import java.text.ParseException;
|
||||
import java.text.SimpleDateFormat;
|
||||
import java.util.*;
|
||||
@@ -38,8 +36,6 @@ public class AdminController {
|
||||
@Autowired
|
||||
private UserServiceImpl userService;
|
||||
@Autowired
|
||||
private UserServiceImpl userServiceImpl;
|
||||
@Autowired
|
||||
private ImgreviewService imgreviewService;
|
||||
@Autowired
|
||||
private ImgTempService imgTempService;
|
||||
@@ -81,11 +77,9 @@ public class AdminController {
|
||||
UploadConfig uploadConfig = uploadConfigService.getUpdateConfig();
|
||||
Imgreview imgreview = imgreviewService.selectByPrimaryKey(1);//查询非法个数
|
||||
Imgreview isImgreviewOK = imgreviewService.selectByusing(1);//查询有没有启动鉴别功能
|
||||
//普通用户
|
||||
String ok = "false";
|
||||
jsonObject.put("myImgTotal", imgService.countimg(user.getId())); //我的图片数
|
||||
jsonObject.put("myAlbumTitle", albumService.selectAlbumCount(user.getId()));//我的画廊数量
|
||||
//计算自己的百分比 已用量/分配量
|
||||
long memory = Long.valueOf(user.getMemory());//分配量
|
||||
Long usermemory = imgService.getusermemory(user.getId())==null?0L:imgService.getusermemory(user.getId());
|
||||
if(memory==0){
|
||||
@@ -174,7 +168,7 @@ public class AdminController {
|
||||
}
|
||||
|
||||
|
||||
@PostMapping("/getRecently")//new 获取榜单和最近上传
|
||||
@PostMapping("/getRecently")//new
|
||||
@ResponseBody
|
||||
public Msg getRecently(@RequestParam(value = "data", defaultValue = "") String data) {
|
||||
Msg msg = new Msg();
|
||||
@@ -184,11 +178,9 @@ public class AdminController {
|
||||
User user = (User) subject.getPrincipal();
|
||||
user = userService.getUsers(user);
|
||||
if(user.getLevel()>1){
|
||||
//管理员 可以看榜单数据 和最近上传
|
||||
jsonObject.put("RecentlyUser",imgService.RecentlyUser());
|
||||
jsonObject.put("RecentlyUploaded",imgService.RecentlyUploaded(user.getId()));
|
||||
}else{
|
||||
//普通用户只能看最近上传
|
||||
jsonObject.put("RecentlyUploaded",imgService.RecentlyUploaded(user.getId()));
|
||||
}
|
||||
}catch (Exception e){
|
||||
@@ -325,7 +317,6 @@ public class AdminController {
|
||||
img.setClassifuidlist(calssif);
|
||||
}
|
||||
if(subject.hasRole("admin")){
|
||||
//管理员 sql根据userid是否等于空做的判断,
|
||||
img.setUserid(null);
|
||||
}else{
|
||||
//普通用户
|
||||
@@ -389,7 +380,6 @@ public class AdminController {
|
||||
userOld.setId(u.getId());
|
||||
User userInfo = userService.getUsers(userOld);
|
||||
if(!userInfo.getUsername().equals(username)){
|
||||
//要修改用户名
|
||||
Integer countusername = userService.countusername(username);
|
||||
if(countusername == 1 || !SysName.CheckSysName(username)){
|
||||
msg.setCode("110406");
|
||||
@@ -400,7 +390,6 @@ public class AdminController {
|
||||
}
|
||||
}
|
||||
if(!userInfo.getEmail().equals(email)){
|
||||
//要修改邮箱
|
||||
Integer countmail = userService.countmail(email);
|
||||
if(countmail == 1){
|
||||
msg.setCode("110407");
|
||||
@@ -458,7 +447,6 @@ public class AdminController {
|
||||
break;
|
||||
}
|
||||
}
|
||||
//删除图片
|
||||
boolean isDele = false;
|
||||
try{
|
||||
if (key.getStorageType() == 1) {
|
||||
@@ -483,11 +471,8 @@ public class AdminController {
|
||||
}catch (Exception e){
|
||||
e.printStackTrace();
|
||||
}
|
||||
|
||||
//删除库
|
||||
if(isDele){
|
||||
try {
|
||||
//删除图像表之前先删除临时数据表,图像表也会删除
|
||||
imgTempService.delImgAndExp(image.getImguid());
|
||||
imgService.deleimg(imgid);
|
||||
imgAndAlbumService.deleteImgAndAlbum(imgname);
|
||||
@@ -505,7 +490,6 @@ public class AdminController {
|
||||
msg.setInfo("图片记录已删除,但是图片源删除失败");
|
||||
}
|
||||
}
|
||||
System.out.println("返回的值:"+msg.toString());
|
||||
return msg;
|
||||
}
|
||||
|
||||
|
||||
@@ -30,8 +30,6 @@ import java.util.Map;
|
||||
@Controller
|
||||
@RequestMapping("/admin/root")
|
||||
public class AdminRootController {
|
||||
@Autowired
|
||||
private NOSImageupload nOSImageupload;
|
||||
@Autowired
|
||||
private ConfigService configService;
|
||||
@Autowired
|
||||
@@ -43,12 +41,8 @@ public class AdminRootController {
|
||||
@Autowired
|
||||
private UploadConfigService uploadConfigService;
|
||||
@Autowired
|
||||
private NoticeService noticeService;
|
||||
@Autowired
|
||||
private SysConfigService sysConfigService;
|
||||
@Autowired
|
||||
private GroupService groupService;
|
||||
@Autowired
|
||||
private ImgService imgService;
|
||||
@Autowired
|
||||
private ImgreviewService imgreviewService;
|
||||
|
||||
@@ -2,7 +2,8 @@ package cn.hellohao.controller;
|
||||
|
||||
import cn.hellohao.pojo.*;
|
||||
import cn.hellohao.pojo.vo.PageResultBean;
|
||||
import cn.hellohao.service.*;
|
||||
import cn.hellohao.service.ImgAndAlbumService;
|
||||
import cn.hellohao.service.UserService;
|
||||
import cn.hellohao.service.impl.AlbumServiceImpl;
|
||||
import com.alibaba.fastjson.JSONArray;
|
||||
import com.alibaba.fastjson.JSONObject;
|
||||
@@ -13,10 +14,10 @@ import org.apache.shiro.SecurityUtils;
|
||||
import org.apache.shiro.subject.Subject;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.ui.Model;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
import org.springframework.web.bind.annotation.PostMapping;
|
||||
import org.springframework.web.bind.annotation.RequestParam;
|
||||
import org.springframework.web.bind.annotation.ResponseBody;
|
||||
|
||||
import javax.servlet.http.HttpSession;
|
||||
import java.text.SimpleDateFormat;
|
||||
import java.util.*;
|
||||
|
||||
@@ -30,14 +31,8 @@ public class AlbumController {
|
||||
@Autowired
|
||||
AlbumServiceImpl albumServiceImpl;
|
||||
@Autowired
|
||||
private ConfigService configService;
|
||||
@Autowired
|
||||
private ImgService imgService;
|
||||
@Autowired
|
||||
ImgAndAlbumService imgAndAlbumService;
|
||||
@Autowired
|
||||
private UploadConfigService uploadConfigService;
|
||||
@Autowired
|
||||
private UserService userService;
|
||||
|
||||
@PostMapping("/admin/getGalleryList") //new
|
||||
|
||||
@@ -1,26 +1,15 @@
|
||||
package cn.hellohao.controller;
|
||||
|
||||
import cn.hellohao.pojo.*;
|
||||
import cn.hellohao.service.*;
|
||||
import cn.hellohao.service.impl.*;
|
||||
import cn.hellohao.utils.*;
|
||||
import cn.hutool.http.HttpUtil;
|
||||
import com.alibaba.fastjson.JSONArray;
|
||||
import com.alibaba.fastjson.JSONObject;
|
||||
import cn.hellohao.pojo.Msg;
|
||||
import cn.hellohao.service.impl.ClientService;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.beans.factory.annotation.Value;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
import org.springframework.web.bind.annotation.PostMapping;
|
||||
import org.springframework.web.bind.annotation.RequestParam;
|
||||
import org.springframework.web.bind.annotation.ResponseBody;
|
||||
import org.springframework.web.bind.annotation.RestController;
|
||||
import org.springframework.web.multipart.MultipartFile;
|
||||
|
||||
import javax.servlet.http.HttpServletRequest;
|
||||
import javax.servlet.http.HttpSession;
|
||||
import java.io.*;
|
||||
import java.net.HttpURLConnection;
|
||||
import java.net.MalformedURLException;
|
||||
import java.net.URL;
|
||||
import java.net.URLConnection;
|
||||
import java.text.SimpleDateFormat;
|
||||
import java.util.*;
|
||||
|
||||
/**
|
||||
* @author Hellohao
|
||||
|
||||
@@ -26,7 +26,6 @@ public class CodeController {
|
||||
@Autowired
|
||||
private CodeService codeService;
|
||||
|
||||
|
||||
@RequestMapping(value = "/selectCodeList")//new
|
||||
@ResponseBody
|
||||
public Map<String, Object> selectCodeList(@RequestParam(value = "data", defaultValue = "") String data) {
|
||||
|
||||
@@ -3,16 +3,12 @@ package cn.hellohao.controller;
|
||||
import cn.hellohao.exception.StorageSourceInitException;
|
||||
import cn.hellohao.utils.Print;
|
||||
import org.springframework.ui.Model;
|
||||
import org.springframework.validation.BindException;
|
||||
import org.springframework.validation.ObjectError;
|
||||
import org.springframework.web.HttpRequestMethodNotSupportedException;
|
||||
import org.springframework.web.bind.annotation.ControllerAdvice;
|
||||
import org.springframework.web.bind.annotation.ExceptionHandler;
|
||||
import org.springframework.web.servlet.ModelAndView;
|
||||
|
||||
import java.net.SocketException;
|
||||
import java.util.Date;
|
||||
import java.util.List;
|
||||
|
||||
/**
|
||||
* @author Hellohao
|
||||
@@ -24,7 +20,6 @@ import java.util.List;
|
||||
public class ExceptionHandling {
|
||||
|
||||
@ExceptionHandler
|
||||
//@ResponseBody
|
||||
public ModelAndView test(StorageSourceInitException ssie){
|
||||
ModelAndView modelAndView = new ModelAndView("index");
|
||||
Print.Normal("异常拦截成功:"+ ssie.getMessage());
|
||||
@@ -39,7 +34,6 @@ public class ExceptionHandling {
|
||||
Print.Normal("存储源配置不正确,初始化失败"+ e.getMessage());
|
||||
e.printStackTrace();
|
||||
modelAndView.addObject("error",e.getMessage());
|
||||
//返回错误信息,并显示给用户
|
||||
return e.getMessage();
|
||||
}
|
||||
@ExceptionHandler
|
||||
@@ -48,7 +42,6 @@ public class ExceptionHandling {
|
||||
Print.Normal("系统内部错误:"+ e.getMessage());
|
||||
e.printStackTrace();
|
||||
modelAndView.addObject("error",e.getMessage());
|
||||
//返回错误信息,并显示给用户
|
||||
return e.getMessage();
|
||||
}
|
||||
|
||||
@@ -57,11 +50,8 @@ public class ExceptionHandling {
|
||||
|
||||
ModelAndView modelAndView = new ModelAndView("/index");
|
||||
Print.Normal("URL访问类型不正确:"+ e.getMessage());
|
||||
//e.printStackTrace();
|
||||
modelAndView.addObject("error","URL访问类型不正确。");
|
||||
model.addAttribute("error","URL访问类型不正确。");
|
||||
//返回错误信息,并显示给用户
|
||||
//return e.getMessage();
|
||||
return "exception";
|
||||
}
|
||||
|
||||
|
||||
@@ -3,8 +3,6 @@ package cn.hellohao.controller;
|
||||
import cn.hellohao.pojo.Group;
|
||||
import cn.hellohao.pojo.Msg;
|
||||
import cn.hellohao.service.GroupService;
|
||||
import cn.hellohao.service.KeysService;
|
||||
import cn.hellohao.service.UserService;
|
||||
import com.alibaba.fastjson.JSONObject;
|
||||
import com.github.pagehelper.PageHelper;
|
||||
import com.github.pagehelper.PageInfo;
|
||||
@@ -28,18 +26,12 @@ import java.util.Map;
|
||||
public class GroupController {
|
||||
@Autowired
|
||||
private GroupService groupService;
|
||||
@Autowired
|
||||
private KeysService keysService;
|
||||
@Autowired
|
||||
private UserService userService;
|
||||
|
||||
|
||||
|
||||
@PostMapping("/getGrouplistForUsers") //new
|
||||
@ResponseBody
|
||||
public Msg getGrouplistForUsers() {
|
||||
Msg msg = new Msg();
|
||||
//只获取用户组type为0的,只有是0的才是未分配用户组的,才能给指定用户设置
|
||||
List<Group> groupList = groupService.grouplist(0);
|
||||
msg.setData(groupList);
|
||||
return msg;
|
||||
|
||||
@@ -100,6 +100,24 @@ public class IndexController {
|
||||
return uploadServicel.uploadForLoc(request,multipartFile,day,null,jsonArray);
|
||||
}
|
||||
|
||||
//根据网络图片url上传
|
||||
@PostMapping(value = "/uploadForUrl") //new
|
||||
@ResponseBody
|
||||
public Msg upurlimg(HttpServletRequest request,@RequestParam(value = "data", defaultValue = "") String data) {
|
||||
JSONObject jsonObj = JSONObject.parseObject(data);
|
||||
final JSONArray jsonArray = new JSONArray();
|
||||
Integer setday = jsonObj.getInteger("day");
|
||||
String imgUrl = jsonObj.getString("imgUrl");
|
||||
String selectTreeListStr = jsonObj.getString("classifications");
|
||||
if(null != selectTreeListStr){
|
||||
String[] calssif = selectTreeListStr.split(",");
|
||||
for (int i = 0; i < calssif.length; i++) {
|
||||
jsonArray.add(calssif[i]);
|
||||
}
|
||||
}
|
||||
return uploadServicel.uploadForLoc(request,null,setday,imgUrl,jsonArray);
|
||||
}
|
||||
|
||||
@RequestMapping(value = "/getUploadInfo")//new
|
||||
@ResponseBody
|
||||
public Msg getUploadInfo() {
|
||||
|
||||
@@ -2,7 +2,6 @@ package cn.hellohao.controller;
|
||||
|
||||
import java.text.SimpleDateFormat;
|
||||
import java.util.Date;
|
||||
import java.util.Random;
|
||||
import java.util.UUID;
|
||||
import javax.servlet.http.HttpServletRequest;
|
||||
import javax.servlet.http.HttpServletResponse;
|
||||
@@ -22,8 +21,8 @@ import org.apache.shiro.subject.Subject;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.stereotype.Controller;
|
||||
import org.springframework.ui.Model;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
import com.alibaba.fastjson.JSONObject;
|
||||
import org.springframework.web.bind.annotation.*;
|
||||
|
||||
|
||||
@Controller
|
||||
@@ -46,7 +45,7 @@ public class UserController {
|
||||
|
||||
@PostMapping("/register")
|
||||
@ResponseBody
|
||||
public Msg Register(HttpServletRequest request,@RequestParam(value = "data", defaultValue = "") String data) {//Validated
|
||||
public Msg Register(HttpServletRequest request, @RequestParam(value = "data", defaultValue = "") String data) {//Validated
|
||||
Msg msg = new Msg();
|
||||
JSONObject jsonObj = JSONObject.parseObject(data);
|
||||
String username = jsonObj.getString("username");
|
||||
@@ -112,7 +111,6 @@ public class UserController {
|
||||
Integer type = 0;
|
||||
if(emailConfig.getUsing()==1){
|
||||
user.setIsok(0);
|
||||
//注册完发激活链接
|
||||
Thread thread = new Thread() {
|
||||
public void run() {
|
||||
Integer a = NewSendEmail.sendEmail(emailConfig,user.getUsername(), uid, user.getEmail(),config);
|
||||
@@ -121,7 +119,6 @@ public class UserController {
|
||||
thread.start();
|
||||
msg.setInfo("注册成功,请注意查收邮箱尽快激活账户");
|
||||
}else{
|
||||
//直接注册
|
||||
user.setIsok(1);
|
||||
msg.setInfo("注册成功,快去登陆吧");
|
||||
}
|
||||
@@ -208,8 +205,6 @@ public class UserController {
|
||||
}
|
||||
|
||||
|
||||
|
||||
//邮箱激活
|
||||
@RequestMapping(value = "/activation", method = RequestMethod.GET)
|
||||
public String activation(Model model, HttpServletRequest request, HttpSession session, String activation, String username) {
|
||||
Config config = configService.getSourceype();
|
||||
@@ -232,7 +227,6 @@ public class UserController {
|
||||
}
|
||||
}
|
||||
|
||||
//退出
|
||||
@PostMapping(value = "/logout")//new
|
||||
@ResponseBody
|
||||
public Msg exit(Model model, HttpServletRequest request, HttpServletResponse response, HttpSession session) {
|
||||
@@ -244,7 +238,6 @@ public class UserController {
|
||||
return msg;
|
||||
}
|
||||
|
||||
//retrievepass
|
||||
@PostMapping("/retrievePass") //new
|
||||
@ResponseBody
|
||||
public Msg retrievePass(HttpServletRequest request, @RequestParam(value = "data", defaultValue = "") String data) {
|
||||
@@ -307,7 +300,6 @@ public class UserController {
|
||||
return msg;
|
||||
}
|
||||
|
||||
//邮箱激活
|
||||
@RequestMapping(value = "/retrieve", method = RequestMethod.GET) //new
|
||||
public String retrieve(Model model, String activation,String cip) {
|
||||
Integer ret = 0;
|
||||
@@ -341,10 +333,5 @@ public class UserController {
|
||||
}
|
||||
|
||||
|
||||
private Integer number1;
|
||||
private Integer istmp1;
|
||||
private Integer number2;
|
||||
private Integer istmp2;
|
||||
|
||||
|
||||
}
|
||||
|
||||
@@ -40,8 +40,6 @@ public interface ImgMapper {
|
||||
|
||||
List<User> RecentlyUser();
|
||||
|
||||
Integer addGreat(@Param("id") Integer id);
|
||||
|
||||
List<String> getyyyy(@Param("userid") Integer userid);
|
||||
|
||||
List<Images> countByM(Images images);
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
package cn.hellohao.dao;
|
||||
|
||||
import org.apache.ibatis.annotations.Mapper;
|
||||
|
||||
@Mapper
|
||||
public interface NoticeMapper {
|
||||
|
||||
String getNotice();
|
||||
}
|
||||
@@ -7,10 +7,7 @@ public class User {
|
||||
//@NotBlank(message = "用户名不能为空")
|
||||
// @Length(min = 6, max = 20, message = "用户名需要为 6 - 20 个字符")
|
||||
private String username;
|
||||
//@NotBlank(message = "密码不能为空")
|
||||
private String password;
|
||||
// @NotBlank(message = "邮箱不能为空")
|
||||
//@Email(message = "邮箱格式不正确")
|
||||
private String email;
|
||||
private String birthder;
|
||||
private Integer level;
|
||||
@@ -20,13 +17,15 @@ public class User {
|
||||
private Integer groupid;
|
||||
private String groupname;
|
||||
|
||||
private Long counts;//用户img counts
|
||||
|
||||
|
||||
public User() {
|
||||
super();
|
||||
}
|
||||
|
||||
public User(Integer id, String username, String password, String email, String birthder, Integer level, String uid,
|
||||
Integer isok, String memory, Integer groupid,String groupname) {
|
||||
Integer isok, String memory, Integer groupid,String groupname,Long counts) {
|
||||
this.id = id;
|
||||
this.username = username;
|
||||
this.password = password;
|
||||
@@ -38,6 +37,7 @@ public class User {
|
||||
this.memory = memory;
|
||||
this.groupid = groupid;
|
||||
this.groupname = groupname;
|
||||
this.counts = counts;
|
||||
}
|
||||
|
||||
public Integer getId() {
|
||||
@@ -127,4 +127,12 @@ public class User {
|
||||
public void setGroupname(String groupname) {
|
||||
this.groupname = groupname;
|
||||
}
|
||||
|
||||
public Long getCounts() {
|
||||
return counts;
|
||||
}
|
||||
|
||||
public void setCounts(Long counts) {
|
||||
this.counts = counts;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -41,8 +41,6 @@ public interface ImgService {
|
||||
|
||||
List<User> RecentlyUser();
|
||||
|
||||
Integer addGreat(Integer id);
|
||||
|
||||
List<String> getyyyy(Integer userid);
|
||||
|
||||
List<Images> countByM(Images images);
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
package cn.hellohao.service;
|
||||
|
||||
import org.springframework.stereotype.Service;
|
||||
|
||||
@Service
|
||||
public interface NoticeService {
|
||||
|
||||
String getNotice();
|
||||
}
|
||||
@@ -61,8 +61,6 @@ public class ClientService {
|
||||
@Autowired
|
||||
private UploadConfigMapper uploadConfigMapper;
|
||||
@Autowired
|
||||
private NoticeMapper noticeMapper;
|
||||
@Autowired
|
||||
private ImgMapper imgMapper;
|
||||
@Autowired
|
||||
ImgreviewMapper imgreviewMapper;
|
||||
|
||||
@@ -230,10 +230,6 @@ public class ImgServiceImpl implements ImgService {
|
||||
return imgMapper.RecentlyUser();
|
||||
}
|
||||
|
||||
@Override
|
||||
public Integer addGreat(Integer id) {
|
||||
return imgMapper.addGreat(id);
|
||||
}
|
||||
|
||||
public List<String> getyyyy(Integer userid){
|
||||
return imgMapper.getyyyy(userid);
|
||||
|
||||
@@ -1,18 +0,0 @@
|
||||
package cn.hellohao.service.impl;
|
||||
|
||||
import cn.hellohao.dao.NoticeMapper;
|
||||
import cn.hellohao.service.NoticeService;
|
||||
import org.springframework.beans.factory.annotation.Autowired;
|
||||
import org.springframework.stereotype.Service;
|
||||
|
||||
@Service
|
||||
public class NoticeServiceImpl implements NoticeService {
|
||||
|
||||
@Autowired
|
||||
private NoticeMapper noticeMapper;
|
||||
|
||||
@Override
|
||||
public String getNotice() {
|
||||
return noticeMapper.getNotice();
|
||||
}
|
||||
}
|
||||
@@ -1 +0,0 @@
|
||||
存储源删除
|
||||
@@ -1,3 +0,0 @@
|
||||
aaaaaaaaaaa
|
||||
vbbbbbbbbbbbbbb
|
||||
cccccccccccc
|
||||
@@ -19,7 +19,6 @@
|
||||
a.imguid,
|
||||
a.format,
|
||||
a.about,
|
||||
a.great,
|
||||
a.violation
|
||||
FROM
|
||||
imgdata a
|
||||
@@ -128,15 +127,11 @@
|
||||
|
||||
<select id="RecentlyUser" resultType="cn.hellohao.pojo.User">
|
||||
select count(i.id) as counts ,i.userid,u.username from imgdata i
|
||||
LEFT JOIN `user` u on i.userid = u.id
|
||||
LEFT JOIN `user` u on i.userid = u.id
|
||||
where i.userid not in (0)
|
||||
GROUP BY i.userid ORDER BY counts DESC LIMIT 20
|
||||
</select>
|
||||
|
||||
<!-- 点赞后累加数 -->
|
||||
<update id="addGreat" parameterType="integer">
|
||||
update imgdata set great = (great+1) where id = #{id}
|
||||
</update>
|
||||
|
||||
|
||||
<select id="getyyyy" parameterType="integer" resultType="string">
|
||||
|
||||
@@ -105,8 +105,8 @@
|
||||
|
||||
<!-- 插入图片信息 -->
|
||||
<insert id="insertimg" parameterType="cn.hellohao.pojo.Images">
|
||||
INSERT INTO imgdata (id, imgname, imgurl, userid, updatetime,sizes,abnormal,source,imgtype,md5key,imguid,format,about,great,violation)
|
||||
VALUES (NULL, #{imgname}, #{imgurl}, #{userid}, #{updatetime},#{sizes},#{abnormal},#{source},#{imgtype},#{md5key},#{imguid},#{format},#{about},"0",null)
|
||||
INSERT INTO imgdata (id, imgname, imgurl, userid, updatetime,sizes,abnormal,source,imgtype,md5key,imguid,format,about,violation)
|
||||
VALUES (NULL, #{imgname}, #{imgurl}, #{userid}, #{updatetime},#{sizes},#{abnormal},#{source},#{imgtype},#{md5key},#{imguid},#{format},#{about},null)
|
||||
</insert>
|
||||
|
||||
<!-- 修改资料 -->
|
||||
|
||||
@@ -1,35 +0,0 @@
|
||||
@charset "utf-8";
|
||||
/* CSS Document */
|
||||
/*Reset*/
|
||||
*{box-sizing:content-box;}
|
||||
a:hover, a:focus{text-decoration:none;}
|
||||
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
|
||||
table{border-collapse:collapse;border-spacing:0;}
|
||||
body{-webkit-text-size-adjust:none;}
|
||||
fieldset,img{border:0;}
|
||||
img{ vertical-align: top; max-width: 100%; }
|
||||
address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:normal;}
|
||||
ol,ul{list-style:none;}
|
||||
caption,th{text-align:left;}
|
||||
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
|
||||
q:before,q:after{content:'';}
|
||||
abbr,acronym {border:0;}
|
||||
.clearfix:after{visibility:hidden;display: block;font-size:0;content:" ";clear:both;height:0;}
|
||||
* html .clearfix{ zoom: 1; } /* IE6 */
|
||||
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
|
||||
.cli{ clear:both; font-size:0; height:0; overflow:hidden;display:block;}
|
||||
.lclear{clear:left;font-size:0;height:0;overflow:hidden;}
|
||||
.fl{float:left;}
|
||||
.fr{float:right;}
|
||||
|
||||
/* ֹ
|
||||
iframe{nifm2:expression(this.src='about:blank',this.outerHTML='');}
|
||||
script{no2js:expression((this.src.toLowerCase().indexOf('http')==0)?document.close():'');}
|
||||
*/
|
||||
/* ıԼ˶
|
||||
div{word-wrap: break-word;word-break: normal;}
|
||||
p{text-align:justify; text-justify:inter-ideograph;}
|
||||
*/
|
||||
/*general*/
|
||||
body{font-size:12px;font-family:'微软雅黑',"宋体","Arial Narrow",Helvetica,sans-serif;color:#000;line-height:1.2;text-align:left;}
|
||||
a{color:#333;text-decoration:none;}
|
||||
@@ -1,113 +0,0 @@
|
||||
html,body{
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
|
||||
canvas{
|
||||
display:block;
|
||||
vertical-align:bottom;
|
||||
}
|
||||
|
||||
.count-particles{
|
||||
background: #000022;
|
||||
position: absolute;
|
||||
top: 48px;
|
||||
left: 0;
|
||||
width: 80px;
|
||||
color: #13E8E9;
|
||||
font-size: .8em;
|
||||
text-align: left;
|
||||
text-indent: 4px;
|
||||
line-height: 14px;
|
||||
padding-bottom: 2px;
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.js-count-particles{
|
||||
font-size: 1.1em;
|
||||
}
|
||||
|
||||
#stats,
|
||||
.count-particles{
|
||||
-webkit-user-select: none;
|
||||
margin-top: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
#stats{
|
||||
border-radius: 3px 3px 0 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.count-particles{
|
||||
border-radius: 0 0 3px 3px;
|
||||
}
|
||||
|
||||
|
||||
/* #particles-js{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background-image: url(../img/bg.jpg);
|
||||
background-position: 50% 50%;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
} */
|
||||
|
||||
.sk-rotating-plane {
|
||||
display: none;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin: auto;
|
||||
background-color: white;
|
||||
-webkit-animation: sk-rotating-plane 1.2s infinite ease-in-out;
|
||||
animation: sk-rotating-plane 1.2s infinite ease-in-out;
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -40px;
|
||||
margin-top: -80px;
|
||||
}
|
||||
.sk-rotating-plane.active{display: block;}
|
||||
|
||||
@keyframes sk-rotating-plane{
|
||||
0% {
|
||||
-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
||||
transform: perspective(120px) rotateX(0deg) rotateY(0deg);
|
||||
}
|
||||
50% {
|
||||
-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
||||
transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
||||
transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes login-small{
|
||||
0%{
|
||||
transform: scale(1);-moz-transform: scale(1); /* Firefox 4 */-webkit-transform: scale(1); /* Safari 和 Chrome */-o-transform: scale(1); /* Opera */-ms-transform:scale(1); /* IE 9 */
|
||||
}
|
||||
100%{
|
||||
transform: scale(0.2);-moz-transform: scale(0.1); /* Firefox 4 */-webkit-transform: scale(0.2); /* Safari 和 Chrome */-o-transform: scale(0.1); /* Opera */-ms-transform:scale(0.1); /* IE 9 */
|
||||
}
|
||||
}
|
||||
|
||||
.login{z-index: 2;position:absolute;width: 350px;border-radius: 5px;height: 500px;background: white;box-shadow: 0px 0px 5px #333333;top: 50%;left: 50%;margin-top: -250px;margin-left: -175px;transition: all 1s;-moz-transition: all 1s; /* Firefox 4 */-webkit-transition: all 1s; /* Safari 和 Chrome */-o-transition: all 1s; /* Opera */}
|
||||
.login-top{font-size: 24px;margin-top: 100px;padding-left: 40px;box-sizing: border-box;color: #333333;margin-bottom: 50px;}
|
||||
.login-center{width: 100%;box-sizing: border-box;padding: 0 40px;margin-bottom: 30px;}
|
||||
.login-center-img{width: 20px;height: 20px;float: left;margin-top: 5px;}
|
||||
.login-center-img>img{width: 100%;}
|
||||
.login-center-input{float: left;width: 265px/*230px*/;margin-left: 0px;height: 30px;position: relative;}
|
||||
.login-center-input input{z-index: 2;transition: all 0.5s;padding-left: 10px;color: #333333;width: 105%;height: 30px;border: 0;border-bottom: 1px solid #cccccc;border-top: 1px solid #ffffff;border-left: 1px solid #ffffff;border-right: 1px solid #ffffff;box-sizing: border-box;outline: none;position: relative;}
|
||||
.login-center-input input:focus{border: 1px solid dodgerblue;}
|
||||
.login-center-input-text{background: white;padding: 0 5px;position: absolute;z-index: 0;opacity: 0;height: 20px;top: 50%;margin-top: -10px;font-size: 14px;left: 5px;color: dodgerblue;line-height: 20px;transition: all 0.5s;-moz-transition: all 0.5s; /* Firefox 4 */-webkit-transition: all 0.5s; /* Safari 和 Chrome */-o-transition: all 0.5s; /* Opera */}
|
||||
.login-center-input input:focus~.login-center-input-text{top: 0;z-index: 3;opacity: 1;margin-top: -15px;}
|
||||
.login.active{-webkit-animation: login-small 0.8s ; animation: login-small 0.8s ;animation-fill-mode:forwards;-webkit-animation-fill-mode:forwards}
|
||||
.login-button{cursor: pointer;width: 250px;text-align: center;height: 40px;line-height: 40px;background-color: dodgerblue;border-radius: 5px;margin: 0 auto;margin-top: 50px;color: white;}
|
||||
|
||||
@@ -1,43 +0,0 @@
|
||||
|
||||
body{
|
||||
background-color:#FFF;
|
||||
/*background: #5583EE;background: -moz-linear-gradient(right, #5583EE 0%, #41D8DD 100%);background: -webkit-linear-gradient(right, #5583EE 0%, #41D8DD 100%);background: linear-gradient(to right, #5583EE 0%, #41D8DD 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5583EE', endColorstr='#41D8DD',GradientType=1 );*/
|
||||
}
|
||||
h1{
|
||||
color:rgb(225,223,220);
|
||||
/*margin-top:160px;*/
|
||||
margin-top:18%;
|
||||
font-size:80px;
|
||||
}
|
||||
h3{
|
||||
color:rgb(225,223,220);
|
||||
}
|
||||
img{
|
||||
/*width:30px;*/
|
||||
/*height:30px;*/
|
||||
}
|
||||
video#bgvid {
|
||||
position: fixed; right: 0; bottom: 0;
|
||||
min-width: 100%; min-height: 100%;
|
||||
width: auto; height: auto; z-index: -100;
|
||||
background-size: cover;
|
||||
}
|
||||
.box{
|
||||
width:100%;
|
||||
}
|
||||
.wForm{
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.wBtn{
|
||||
margin-top: 20px;
|
||||
width: 200px;
|
||||
height: 80px;
|
||||
border-radius: 130px;
|
||||
opacity: 0.9;
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
.kenburnsy{position:relative;overflow:hidden;width:100%}.kenburnsy .slide,.kenburnsy.fullscreen{position:absolute;top:0;left:0;right:0;bottom:0}.kenburnsy.fullscreen{z-index:-1}.kenburnsy img{display:none}.kenburnsy .slide{background-repeat:no-repeat;background-position:center center;background-size:cover;transform-origin:center;transform:translateZ(0)}
|
||||
@@ -1,5 +0,0 @@
|
||||
.wordsrotator_words{display:inline-block; width:100%; position:relative; -webkit-transition:width 1s; -moz-transition:width 1s; -o-transition:width 1s; transition:width 1s;}
|
||||
.wordsrotator_words .wordsrotator_wordOut, .wordsrotator_words .wordsrotator_wordIn{position:relative; display:inline-block; -webkit-animation-duration:1s; -webkit-animation-timing-function:ease; -webkit-animation-fill-mode:both; -moz-animation-duration:1s; -moz-animation-timing-function:ease; -moz-animation-fill-mode:both; -ms-animation-duration:1s; -ms-animation-timing-function:ease; -ms-animation-fill-mode:both;}
|
||||
.wordsrotator_words .wordsrotator_wordOut{width:100%; display:inline-block; position:absolute; left:0px; -webkit-backface-visibility:hidden;}
|
||||
.wordsrotator_words .wordsrotator_wordOut span{width:auto; position:relative; -webkit-backface-visibility:hidden;}
|
||||
.wordsrotator_words .wordsrotator_wordIn{opacity:0; -webkit-backface-visibility:hidden;}
|
||||
@@ -1,248 +0,0 @@
|
||||
/*
|
||||
* Core Owl Carousel CSS File
|
||||
* v1.3.3
|
||||
*/
|
||||
|
||||
/* clearfix */
|
||||
.owl-carousel .owl-wrapper:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
line-height: 0;
|
||||
height: 0;
|
||||
}
|
||||
/* display none until init */
|
||||
.owl-carousel{
|
||||
display: none;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
-ms-touch-action: pan-y;
|
||||
margin-left:0px;
|
||||
}
|
||||
.owl-carousel .owl-wrapper{
|
||||
display: none;
|
||||
position: relative;
|
||||
-webkit-transform: translate3d(0px, 0px, 0px);
|
||||
padding:0px 0px;
|
||||
}
|
||||
.owl-carousel .owl-wrapper-outer{
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
width: 99.9%;
|
||||
}
|
||||
.carousel-no-pad.owl-carousel{
|
||||
margin-left:0px;
|
||||
padding:0px;
|
||||
}
|
||||
.carousel-no-pad.owl-carousel .owl-wrapper{
|
||||
padding:0px;
|
||||
}
|
||||
.carousel-no-pad.owl-carousel .owl-wrapper-outer{
|
||||
width:100%;
|
||||
}
|
||||
.owl-carousel .owl-wrapper-outer.autoHeight{
|
||||
-webkit-transition: height 500ms ease-in-out;
|
||||
-moz-transition: height 500ms ease-in-out;
|
||||
-ms-transition: height 500ms ease-in-out;
|
||||
-o-transition: height 500ms ease-in-out;
|
||||
transition: height 500ms ease-in-out;
|
||||
}
|
||||
|
||||
.owl-carousel .owl-item{
|
||||
float: left;
|
||||
padding:0px 5px;
|
||||
}
|
||||
.owl-controls .owl-page,
|
||||
.owl-controls .owl-buttons div{
|
||||
cursor: pointer;
|
||||
}
|
||||
.owl-controls {
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
/* mouse grab icon */
|
||||
.grabbing {
|
||||
cursor:url(../img/grabbing.png) 8 8, move;
|
||||
}
|
||||
|
||||
/* fix */
|
||||
.owl-carousel .owl-wrapper,
|
||||
.owl-carousel .owl-item{
|
||||
-webkit-backface-visibility: hidden;
|
||||
-moz-backface-visibility: hidden;
|
||||
-ms-backface-visibility: hidden;
|
||||
-webkit-transform: translate3d(0,0,0);
|
||||
-moz-transform: translate3d(0,0,0);
|
||||
-ms-transform: translate3d(0,0,0);
|
||||
}
|
||||
|
||||
/*
|
||||
* Owl Carousel CSS3 Transitions
|
||||
* v1.3.2
|
||||
*/
|
||||
|
||||
.owl-origin {
|
||||
-webkit-perspective: 1200px;
|
||||
-webkit-perspective-origin-x : 50%;
|
||||
-webkit-perspective-origin-y : 50%;
|
||||
-moz-perspective : 1200px;
|
||||
-moz-perspective-origin-x : 50%;
|
||||
-moz-perspective-origin-y : 50%;
|
||||
perspective : 1200px;
|
||||
}
|
||||
/* fade */
|
||||
.owl-fade-out {
|
||||
z-index: 10;
|
||||
-webkit-animation: fadeOut .7s both ease;
|
||||
-moz-animation: fadeOut .7s both ease;
|
||||
animation: fadeOut .7s both ease;
|
||||
}
|
||||
.owl-fade-in {
|
||||
-webkit-animation: fadeIn .7s both ease;
|
||||
-moz-animation: fadeIn .7s both ease;
|
||||
animation: fadeIn .7s both ease;
|
||||
}
|
||||
|
||||
/* backSlide */
|
||||
.owl-backSlide-out {
|
||||
-webkit-animation: backSlideOut 1s both ease;
|
||||
-moz-animation: backSlideOut 1s both ease;
|
||||
animation: backSlideOut 1s both ease;
|
||||
}
|
||||
.owl-backSlide-in {
|
||||
-webkit-animation: backSlideIn 1s both ease;
|
||||
-moz-animation: backSlideIn 1s both ease;
|
||||
animation: backSlideIn 1s both ease;
|
||||
}
|
||||
/* goDown */
|
||||
.owl-goDown-out {
|
||||
-webkit-animation: scaleToFade .7s ease both;
|
||||
-moz-animation: scaleToFade .7s ease both;
|
||||
animation: scaleToFade .7s ease both;
|
||||
}
|
||||
.owl-goDown-in {
|
||||
-webkit-animation: goDown .6s ease both;
|
||||
-moz-animation: goDown .6s ease both;
|
||||
animation: goDown .6s ease both;
|
||||
}
|
||||
/* scaleUp */
|
||||
.owl-fadeUp-in {
|
||||
-webkit-animation: scaleUpFrom .5s ease both;
|
||||
-moz-animation: scaleUpFrom .5s ease both;
|
||||
animation: scaleUpFrom .5s ease both;
|
||||
}
|
||||
|
||||
.owl-fadeUp-out {
|
||||
-webkit-animation: scaleUpTo .5s ease both;
|
||||
-moz-animation: scaleUpTo .5s ease both;
|
||||
animation: scaleUpTo .5s ease both;
|
||||
}
|
||||
/* Keyframes */
|
||||
/*empty*/
|
||||
@-webkit-keyframes empty {
|
||||
0% {opacity: 1}
|
||||
}
|
||||
@-moz-keyframes empty {
|
||||
0% {opacity: 1}
|
||||
}
|
||||
@keyframes empty {
|
||||
0% {opacity: 1}
|
||||
}
|
||||
@-webkit-keyframes fadeIn {
|
||||
0% { opacity:0; }
|
||||
100% { opacity:1; }
|
||||
}
|
||||
@-moz-keyframes fadeIn {
|
||||
0% { opacity:0; }
|
||||
100% { opacity:1; }
|
||||
}
|
||||
@keyframes fadeIn {
|
||||
0% { opacity:0; }
|
||||
100% { opacity:1; }
|
||||
}
|
||||
@-webkit-keyframes fadeOut {
|
||||
0% { opacity:1; }
|
||||
100% { opacity:0; }
|
||||
}
|
||||
@-moz-keyframes fadeOut {
|
||||
0% { opacity:1; }
|
||||
100% { opacity:0; }
|
||||
}
|
||||
@keyframes fadeOut {
|
||||
0% { opacity:1; }
|
||||
100% { opacity:0; }
|
||||
}
|
||||
@-webkit-keyframes backSlideOut {
|
||||
25% { opacity: .5; -webkit-transform: translateZ(-500px); }
|
||||
75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); }
|
||||
100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); }
|
||||
}
|
||||
@-moz-keyframes backSlideOut {
|
||||
25% { opacity: .5; -moz-transform: translateZ(-500px); }
|
||||
75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); }
|
||||
100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); }
|
||||
}
|
||||
@keyframes backSlideOut {
|
||||
25% { opacity: .5; transform: translateZ(-500px); }
|
||||
75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); }
|
||||
100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); }
|
||||
}
|
||||
@-webkit-keyframes backSlideIn {
|
||||
0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); }
|
||||
75% { opacity: .5; -webkit-transform: translateZ(-500px); }
|
||||
100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); }
|
||||
}
|
||||
@-moz-keyframes backSlideIn {
|
||||
0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); }
|
||||
75% { opacity: .5; -moz-transform: translateZ(-500px); }
|
||||
100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); }
|
||||
}
|
||||
@keyframes backSlideIn {
|
||||
0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); }
|
||||
75% { opacity: .5; transform: translateZ(-500px); }
|
||||
100% { opacity: 1; transform: translateZ(0) translateX(0); }
|
||||
}
|
||||
@-webkit-keyframes scaleToFade {
|
||||
to { opacity: 0; -webkit-transform: scale(.8); }
|
||||
}
|
||||
@-moz-keyframes scaleToFade {
|
||||
to { opacity: 0; -moz-transform: scale(.8); }
|
||||
}
|
||||
@keyframes scaleToFade {
|
||||
to { opacity: 0; transform: scale(.8); }
|
||||
}
|
||||
@-webkit-keyframes goDown {
|
||||
from { -webkit-transform: translateY(-100%); }
|
||||
}
|
||||
@-moz-keyframes goDown {
|
||||
from { -moz-transform: translateY(-100%); }
|
||||
}
|
||||
@keyframes goDown {
|
||||
from { transform: translateY(-100%); }
|
||||
}
|
||||
|
||||
@-webkit-keyframes scaleUpFrom {
|
||||
from { opacity: 0; -webkit-transform: scale(1.5); }
|
||||
}
|
||||
@-moz-keyframes scaleUpFrom {
|
||||
from { opacity: 0; -moz-transform: scale(1.5); }
|
||||
}
|
||||
@keyframes scaleUpFrom {
|
||||
from { opacity: 0; transform: scale(1.5); }
|
||||
}
|
||||
|
||||
@-webkit-keyframes scaleUpTo {
|
||||
to { opacity: 0; -webkit-transform: scale(1.5); }
|
||||
}
|
||||
@-moz-keyframes scaleUpTo {
|
||||
to { opacity: 0; -moz-transform: scale(1.5); }
|
||||
}
|
||||
@keyframes scaleUpTo {
|
||||
to { opacity: 0; transform: scale(1.5); }
|
||||
}
|
||||
@@ -1,99 +0,0 @@
|
||||
/*
|
||||
* Owl Carousel Owl Demo Theme
|
||||
* v1.3.3
|
||||
*/
|
||||
|
||||
.owl-theme .owl-controls{
|
||||
margin-top: 39px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* Styling Next and Prev buttons */
|
||||
|
||||
.owl-theme .owl-controls .owl-buttons div{
|
||||
color: #FFF;
|
||||
display: inline-block;
|
||||
zoom: 1;
|
||||
*display: inline;/*IE7 life-saver */
|
||||
margin: 5px;
|
||||
padding: 3px 10px;
|
||||
font-size: 12px;
|
||||
-webkit-border-radius: 30px;
|
||||
-moz-border-radius: 30px;
|
||||
border-radius: 30px;
|
||||
background: #869791;
|
||||
filter: Alpha(Opacity=50);/*IE7 fix*/
|
||||
opacity: 0.5;
|
||||
}
|
||||
/* Clickable class fix problem with hover on touch devices */
|
||||
/* Use it for non-touch hover action */
|
||||
.owl-theme .owl-controls.clickable .owl-buttons div:hover{
|
||||
filter: Alpha(Opacity=100);/*IE7 fix*/
|
||||
opacity: 1;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Styling Pagination*/
|
||||
|
||||
.owl-theme .owl-controls .owl-page{
|
||||
display: inline-block;
|
||||
zoom: 1;
|
||||
*display: inline;/*IE7 life-saver */
|
||||
}
|
||||
.owl-theme .owl-controls .owl-page span{
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin: 0px 7px 0px 7px;
|
||||
padding: 0px;
|
||||
background: white;
|
||||
-webkit-transition:all 0.5s ease;
|
||||
-moz-transition:all 0.5s ease;
|
||||
-o-transition:all 0.5s ease;
|
||||
-ms-transition:all 0.5s ease;
|
||||
transition:all 0.5s ease;
|
||||
-webkit-transform-origin: 50% 50%;
|
||||
-moz-transform-origin: 50% 50%;
|
||||
-ms-transform-origin: 50% 50%;
|
||||
-o-transform-origin: 50% 50%;
|
||||
transform-origin: 50% 50%;
|
||||
-webkit-transform: rotateY(0deg);
|
||||
-moz-transform: rotateY(0deg);
|
||||
-ms-transform: rotateY(0deg);
|
||||
-o-transform: rotateY(0deg);
|
||||
transform: rotateY(0deg);
|
||||
-webkit-border-radius:50%;
|
||||
-moz-border-radius:50%;
|
||||
-ms-border-radius:50%;
|
||||
-o-border-radius:50%;
|
||||
border-radius:50%;
|
||||
}
|
||||
|
||||
.owl-theme .owl-controls .owl-page.active span,
|
||||
.owl-theme .owl-controls.clickable .owl-page:hover span{
|
||||
background:#d7f257;
|
||||
-webkit-transform: rotateY(180deg);
|
||||
-moz-transform: rotateY(180deg);
|
||||
-ms-transform: rotateY(180deg);
|
||||
-o-transform: rotateY(180deg);
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
||||
/* If PaginationNumbers is true */
|
||||
|
||||
.owl-theme .owl-controls .owl-page span.owl-numbers{
|
||||
height: auto;
|
||||
width: auto;
|
||||
color: #FFF;
|
||||
padding: 2px 10px;
|
||||
font-size: 12px;
|
||||
-webkit-border-radius: 30px;
|
||||
-moz-border-radius: 30px;
|
||||
border-radius: 30px;
|
||||
}
|
||||
|
||||
/* preloading images */
|
||||
.owl-item.loading{
|
||||
min-height: 150px;
|
||||
background: url(AjaxLoader.gif) no-repeat center center
|
||||
}
|
||||
@@ -1,547 +0,0 @@
|
||||
*, ::after, ::before {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: "Open Sans",sans-serif;
|
||||
font-display: auto;
|
||||
font-weight: 400;
|
||||
font-size: 15px;
|
||||
line-height: 24px;
|
||||
color: #222;
|
||||
background: #fff;
|
||||
overflow-x: hidden;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
|
||||
.pb-70 {
|
||||
padding-bottom: 70px!important;
|
||||
}
|
||||
.pt-80 {
|
||||
padding-top: 80px!important;
|
||||
}
|
||||
.font__weight-thin {
|
||||
font-weight: 100;
|
||||
}
|
||||
.divider {
|
||||
width: 35px;
|
||||
height: 2px;
|
||||
background: #2775ff;
|
||||
margin: 25px auto 32px;
|
||||
border: 0;
|
||||
}
|
||||
.panel__head, .panel__list {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.panel__wrapper-icon .panel__head {
|
||||
background: linear-gradient(to right,#2775ff,#7202bb);
|
||||
padding: 24px 40px;
|
||||
box-shadow: 0 6px 30px 0 rgba(0,0,0,.12);
|
||||
color: rgba(255,255,255,.9);
|
||||
}
|
||||
|
||||
@media (min-width: 768px)
|
||||
.panel__wrapper-icon .panel__head {
|
||||
padding: 24px 50px;
|
||||
}
|
||||
|
||||
@media (min-width: 992px)
|
||||
.panel__wrapper-icon .panel__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@media (min-width: 992px)
|
||||
.panel__wrapper-icon .panel__head p {
|
||||
margin-top: 0;
|
||||
margin-left: 58px;
|
||||
}
|
||||
.panel__wrapper-icon .panel__head p {
|
||||
flex: 1;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.font__size-14 {
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
.panel__head, .panel__list {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__list {
|
||||
background: #fff;
|
||||
box-shadow: 0 6px 30px 0 rgba(0,0,0,.12);
|
||||
}
|
||||
.panel__head, .panel__list {
|
||||
text-align: left;
|
||||
}
|
||||
.panel__list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li {
|
||||
color: #4e4e4e;
|
||||
font-family: 'Open Sans',sans-serif;
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid #ececec;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 28px;
|
||||
}
|
||||
|
||||
|
||||
.panel__wrapper-icon .panel__list li .line {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translate(0,-50%);
|
||||
left: 0;
|
||||
width: 3px;
|
||||
height: 40px;
|
||||
background: linear-gradient(to bottom,#2775ff,#7202bb);
|
||||
opacity: 0;
|
||||
transition: all .3s ease;
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li:hover {
|
||||
z-index: 2;
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li:hover .line {
|
||||
opacity: 1;
|
||||
left: -15px;
|
||||
transition-delay: .1s;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__list li:nth-child(2n) {
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 576px)
|
||||
.panel__wrapper-icon .panel__list li {
|
||||
padding-left: 110px;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__list li {
|
||||
color: #4e4e4e;
|
||||
font-family: 'Open Sans',sans-serif;
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid #ececec;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 28px;
|
||||
}
|
||||
|
||||
abbr, acronym, address, applet, article, aside, audio, b, big, body, button, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font: inherit;
|
||||
vertical-align: top;
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li:hover:after, .panel__wrapper-table .panel__list li:hover:after {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.panel__wrapper-gradient .panel__list li:after, .panel__wrapper-icon .panel__list li:after, .panel__wrapper-table .panel__list li:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
left: -15px;
|
||||
right: -15px;
|
||||
bottom: -6px;
|
||||
background: #fff;
|
||||
box-shadow: 0 6px 30px 0 rgba(0,0,0,.12);
|
||||
opacity: 0;
|
||||
transition: all .3s ease;
|
||||
transform: scale(.95);
|
||||
z-index: -1;
|
||||
}
|
||||
.font__family-open-sans {
|
||||
font-family: 'Open Sans',sans-serif;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__head p {
|
||||
margin-top: 0;
|
||||
margin-left: 58px;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.font__size-21 {
|
||||
font-size: 1.3125rem;
|
||||
}
|
||||
|
||||
.font__family-montserrat {
|
||||
font-family: 'Montserrat',sans-serif;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__list li .icon {
|
||||
font-size: 36px;
|
||||
color: #2775ff;
|
||||
opacity: .5;
|
||||
transition: all .3s ease;
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
width: auto!important;
|
||||
height: auto!important;
|
||||
line-height: normal!important;
|
||||
margin-left: 0!important;
|
||||
}
|
||||
.icon {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
}
|
||||
.fal, .far {
|
||||
font-weight: 600!important;
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li {
|
||||
color: #4e4e4e;
|
||||
font-family: 'Open Sans',sans-serif;
|
||||
font-size: 14px;
|
||||
border-bottom: 1px solid #ececec;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 28px;
|
||||
}
|
||||
|
||||
.panel__wrapper-icon .panel__list li .icon {
|
||||
position: absolute;
|
||||
left: 40px;
|
||||
margin-bottom: 0;
|
||||
top: 50%;
|
||||
transform: translate(0,-50%);
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li {
|
||||
padding-left: 110px;
|
||||
}
|
||||
.panel__wrapper-icon .panel__list li:hover .icon {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/************************************/
|
||||
.list-inline-4 li:hover>.after, .list-inline-5>li.list-counter:hover .list-shape, .list-inline-5>li.list-counter:hover>.after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.list-inline-4 li>.after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 50px;
|
||||
background: linear-gradient(to right,#2775ff,#7202bb);
|
||||
z-index: -1;
|
||||
transition: all .4s ease;
|
||||
opacity: 0;
|
||||
}
|
||||
.list-inline-4 li>.before {
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
left: 1.25em;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.list-inline-3 li>.after, .list-inline-4 li>.before {
|
||||
position: absolute;
|
||||
transition: all .4s ease;
|
||||
background: #2775ff;
|
||||
}
|
||||
.list-inline-4 li {
|
||||
display: block;
|
||||
text-align: left;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 50px;
|
||||
padding: .875em .875em .875em 3.4375em;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
transition: all .4s ease;
|
||||
}
|
||||
|
||||
.font__size-16 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.font__family-montserrat {
|
||||
font-family: 'Montserrat',sans-serif;
|
||||
}
|
||||
|
||||
.list-inline-4 li {
|
||||
display: block;
|
||||
text-align: left;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 50px;
|
||||
padding: .875em .875em .875em 3.4375em;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
transition: all .4s ease;
|
||||
}
|
||||
.mb-35 {
|
||||
margin-bottom: 35px!important;
|
||||
}
|
||||
.mb-100 {
|
||||
margin-bottom: 100px!important;
|
||||
}
|
||||
.list-inline-4 li+li {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.list-inline-4 li:hover>.after, .list-inline-5>li.list-counter:hover .list-shape, .list-inline-5>li.list-counter:hover>.after {
|
||||
opacity: 1;
|
||||
}
|
||||
.list-inline-4 li .icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 25px;
|
||||
transform: translateY(-50%);
|
||||
color: #fff;
|
||||
z-index: 2;
|
||||
}
|
||||
.list-inline-4 li:hover>.before {
|
||||
background: 0 0;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
.list-inline-4 li:hover {
|
||||
color: #fff;
|
||||
box-shadow: 0 5px 16px 0 rgba(165,165,165,.5);
|
||||
}
|
||||
.list-inline-3 li:hover, .list-inline-3 li:hover a, .list-inline-4 li:hover a, .list-inline-5>li.list-counter:hover, .list-inline-5>li.list-counter:hover a, .list-inline-5>li.list-counter:hover>.before, .list-inline-6 li:hover:before {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.fa-angle-right:before {
|
||||
content: "\f105";
|
||||
}
|
||||
|
||||
[class*=list-inline] a {
|
||||
transition: none;
|
||||
text-decoration: none!important;
|
||||
}
|
||||
.letter-spacing-60 {
|
||||
letter-spacing: .06em;
|
||||
}
|
||||
.font__size-46 {
|
||||
font-size: 2.875rem;
|
||||
}
|
||||
.font__weight-thin {
|
||||
font-weight: 100;
|
||||
}
|
||||
.font__family-roboto {
|
||||
font-family: 'Roboto',sans-serif;
|
||||
}
|
||||
.text-uppercase {
|
||||
text-transform: uppercase!important;
|
||||
}
|
||||
.line__height-26 {
|
||||
line-height: 1.625rem;
|
||||
}
|
||||
.font__size-16 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.font__weight-normal {
|
||||
font-weight: 400;
|
||||
}
|
||||
.brk-dark-font-color {
|
||||
color: #585858;
|
||||
}
|
||||
|
||||
.brk-dark-font-color{ font-family: "Open Sans",sans-serif;}
|
||||
|
||||
.pb-70 {
|
||||
padding-bottom: 70px!important;
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
font: inherit;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/*******************************************/
|
||||
.overflow-hid {
|
||||
overflow: hidden!important;
|
||||
}
|
||||
.bg__style {
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
.position-relative {
|
||||
position: relative!important;
|
||||
}
|
||||
.brk-abs-bg-overlay, .brk-abs-img, .brk-abs-overlay {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.opacity-90 {
|
||||
opacity: .9;
|
||||
}
|
||||
.brk-base-bg-gradient-50deg {
|
||||
background-image: linear-gradient(to right, #2775ff, #008dff, #00a2ff, #00b5ff, #00c6ff);
|
||||
}
|
||||
|
||||
.info-box__wrapper-web {
|
||||
padding: 70px 20px;
|
||||
}
|
||||
.info-box__wrapper-web {
|
||||
text-align: left;
|
||||
padding: 50px 20px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
[class*=info-box__wrapper] {
|
||||
transition: all .4s ease;
|
||||
}
|
||||
.info-box__wrapper-strict, .info-box__wrapper-web .shape {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.info-box__wrapper-web .shape:before {
|
||||
content: '';
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.info-box__wrapper-web .livicon-evo, .info-box__wrapper-web .shape:before {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
}
|
||||
.info-box__wrapper-web .shape>.after, .info-box__wrapper-web .shape>.before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
background-color: #fff;
|
||||
transition: all .4s ease;
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
.info-box__wrapper-web .shape>.before {
|
||||
transform: scale(1.35);
|
||||
}
|
||||
.info-box__wrapper-web .svg-wrap {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: inline-block;
|
||||
background: linear-gradient(to top,var(--brk-base-6),var(--brk-base-2));
|
||||
transition: all .4s ease;
|
||||
border-radius: 50%;
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
box-shadow: 0 0 10px 0 rgba(0,0,0,.15);
|
||||
transform: scale(0);
|
||||
}
|
||||
.info-box__wrapper-web .svg-wrap svg {
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
z-index: 2;
|
||||
}
|
||||
[class*=info-box__wrapper] svg {
|
||||
transition: all .4s ease;
|
||||
width: 84px;
|
||||
height: 84px;
|
||||
}
|
||||
.info-box__wrapper-web .shape>.after, .info-box__wrapper-web .shape>.before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
background-color: #fff;
|
||||
transition: all .4s ease;
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
.info-box__wrapper-web .shape:after {
|
||||
content: '';
|
||||
}
|
||||
.info-box__wrapper-web .shape:after {
|
||||
position: absolute;
|
||||
bottom: calc(50% + 7px);
|
||||
left: calc(50% - 1px);
|
||||
width: 2px;
|
||||
height: 100vh;
|
||||
background: #fff;
|
||||
}
|
||||
.info-box__wrapper-web .content>* {
|
||||
color: #fff;
|
||||
}
|
||||
.info-box__wrapper-web .content p {
|
||||
color: #b3daee;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.info-box__wrapper-web.current .shape>.before, .info-box__wrapper-web:hover .shape>.before, .wpb_column.current .info-box__wrapper-web .shape>.before {
|
||||
-webkit-animation: 1.5s brk-pulse .3s infinite;
|
||||
animation: 1.5s brk-pulse .3s infinite;
|
||||
opacity: .1;
|
||||
}
|
||||
.info-box__wrapper-web .shape>.after, .info-box__wrapper-web .shape>.before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
background-color: #fff;
|
||||
transition: all .4s ease;
|
||||
border-radius: 50%;
|
||||
z-index: -1;
|
||||
}
|
||||
.info-box__wrapper-web .shape>.before {
|
||||
transform: scale(1.35);
|
||||
}
|
||||
.info-box__wrapper-web.current .svg-wrap, .info-box__wrapper-web:hover .svg-wrap {
|
||||
transform: scale(1);
|
||||
}
|
||||
.info-box__wrapper-web .svg-wrap {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
display: inline-block;
|
||||
background: linear-gradient(to top,#0b98f6,#00c6ff);
|
||||
transition: all .4s ease;
|
||||
border-radius: 50%;
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
box-shadow: 0 0 10px 0 rgba(0,0,0,.15);
|
||||
transform: scale(0);
|
||||
}
|
||||
.info-box__wrapper-shuffle.current svg *, .info-box__wrapper-shuffle:hover svg *, .info-box__wrapper-web svg *, .wpb_column.current .info-box__wrapper-strict svg * {
|
||||
stroke: #fff;
|
||||
}
|
||||
|
||||
.wpb_column.current .info-box__wrapper-web .svg-wrap {
|
||||
transform: scale(1);
|
||||
}
|
||||
.wpb_column.current .info-box__wrapper-web .shape > .before {
|
||||
animation: 1.5s brk-pulse 0.3s infinite;
|
||||
opacity: 0.1;
|
||||
}
|
||||
.wpb_column.current .info-box__wrapper-web .shape > .after {
|
||||
animation: brk-pulse 1.5s infinite;
|
||||
opacity: 0.2;
|
||||
}
|
||||
@-webkit-keyframes brk-pulse{0%{transform:scale(1)}50%{transform:scale(2)}to{transform:scale(1);opacity:0}}@keyframes brk-pulse{0%{transform:scale(1)}50%{transform:scale(2)}to{transform:scale(1);opacity:0}}@-webkit-keyframes brk-pulse-paused{0%,to{transform:scale(1)}20%{transform:scale(1.2)}60%{transform:scale(.9);opacity:0}}@keyframes brk-pulse-paused{0%,to{transform:scale(1)}20%{transform:scale(1.2)}60%{transform:scale(.9);opacity:0}}
|
||||
|
||||
@@ -1,170 +0,0 @@
|
||||
/*常规验证码*/
|
||||
.verify-code {
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
margin-bottom: 5px;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.cerify-code-panel {
|
||||
height:100%;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.verify-code-area {
|
||||
float:left;
|
||||
}
|
||||
|
||||
.verify-input-area {
|
||||
float: left;
|
||||
width: 60%;
|
||||
padding-right: 10px;
|
||||
|
||||
}
|
||||
|
||||
.verify-change-area {
|
||||
line-height: 30px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.varify-input-code {
|
||||
display:inline-block;
|
||||
width: 100%;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.verify-change-code {
|
||||
color: #337AB7;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.verify-btn {
|
||||
width: 200px;
|
||||
height: 30px;
|
||||
background-color: #337AB7;
|
||||
color:#FFFFFF;
|
||||
border:none;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*滑动验证码*/
|
||||
.verify-bar-area {
|
||||
position: relative;
|
||||
background: #FFFFFF;
|
||||
text-align: center;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
border: 1px solid #ddd;
|
||||
-webkit-border-radius: 4px;
|
||||
}
|
||||
|
||||
.verify-bar-area .verify-move-block {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0;
|
||||
background: #fff;
|
||||
cursor: pointer;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
box-shadow: 0 0 2px #888888;
|
||||
-webkit-border-radius: 1px;
|
||||
}
|
||||
|
||||
.verify-bar-area .verify-move-block:hover {
|
||||
background-color: #337ab7;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.verify-bar-area .verify-left-bar {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: -1px;
|
||||
background: #f0fff0;
|
||||
cursor: pointer;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
|
||||
.verify-img-panel {
|
||||
margin:0;
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 3px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.verify-img-panel .verify-refresh {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
text-align:center;
|
||||
padding: 5px;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.verify-img-panel .icon-refresh {
|
||||
font-size: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.verify-img-panel .verify-gap {
|
||||
background-color: #fff;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
border:1px solid #fff;
|
||||
}
|
||||
|
||||
.verify-bar-area .verify-move-block .verify-sub-block {
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
z-index: 3;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.verify-bar-area .verify-move-block .verify-icon {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.verify-bar-area .verify-msg {
|
||||
z-index : 3;
|
||||
}
|
||||
|
||||
/*字体图标的css*/
|
||||
@font-face {font-family: "iconfont";
|
||||
src: url('../fonts/iconfont.eot?t=1508229193188'); /* IE9*/
|
||||
src: url('../fonts/iconfont.eot?t=1508229193188#iefix') format('embedded-opentype'), /* IE6-IE8 */
|
||||
url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAaAAAsAAAAACUwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFZW7kiSY21hcAAAAYAAAAB3AAABuM+qBlRnbHlmAAAB+AAAAnQAAALYnrUwT2hlYWQAAARsAAAALwAAADYPNwajaGhlYQAABJwAAAAcAAAAJAfeA4dobXR4AAAEuAAAABMAAAAYF+kAAGxvY2EAAATMAAAADgAAAA4CvAGsbWF4cAAABNwAAAAfAAAAIAEVAF1uYW1lAAAE/AAAAUUAAAJtPlT+fXBvc3QAAAZEAAAAPAAAAE3oPPXPeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk/sM4gYGVgYOpk+kMAwNDP4RmfM1gxMjBwMDEwMrMgBUEpLmmMDgwVDxbwtzwv4EhhrmBoQEozAiSAwAw1A0UeJzFkcENgCAMRX8RjCGO4gTe9eQcnhzAfXC2rqG/hYsT8MmD9gdS0gJIAAaykAjIBYHppCvuD8juR6zMJ67A89Zdn/f1aNPikUn8RvYo8G20CjKim6Rf6b9m34+WWd/vBr+oW8V6q3vF5qKlYrPRp4L0Ad5nGL8AeJxFUc9rE0EYnTezu8lMsrvtbrqb3TRt0rS7bdOmdI0JbWmCtiItIv5oi14qevCk9SQVLFiQgqAF8Q9QLKIHLx48FkHo3ZNnFUXwD5C2B6dO6sFhmI83w7z3fe8RnZCjb2yX5YlLhskkmScXCIFRxYBFiyjH9Rqtoqes9/g5i8WVuJyqDNTYLPwBI+cljXrkGynDhoU+nCgnjbhGY5yst+gMEq8IBIXwsjPU67CnEPm4b0su0h309Fd67da4XBhr55KSm17POk7gOE/Shq6nKdVsC7d9j+tcGPKVboc9u/0jtB/ZIA7PXTVLBef6o/paccjnwOYm3ELJetPuDrvV3gg91wlSXWY6H5qVwRzWf2TybrYYfSdqoXOwh/Qa8RWIjBTiSI3h614/vKSNRhONOrsnQi6Xf4nQFQDTmJE1NKbhI6crHEJO/+S5QPxhYJRRyvBFBP+5T9EPpEAIVzzRQIrjmJ6jY1WTo+NXTMchuBsKuS8PRZATSMl9oTA4uNLkeIA0V1UeqOoGQh7IAxGo+7T83fn3T+voqCNPPAUazUYUI7LgKSV1Jk2oUeghYGhZ+cKOe2FjVu5ZKEY2VkE13AK1+jI4r1KLbPlZfrKiPhOXKPRj7q9sj9XJ7LFHNmrKJS3VCdhXGSdKrtmoQaWeMjQVt0KD6sGPOx0oH2fgtzoNROxtNq8F3tzYM/n+TjKSX5qf2jx941276TIr9FjXxKr8eX/6bK4yuopwo9py1sw8F9kdw4AmurRpLUM3tYx5ZnKpfHPi8dzz19vJ6MjyxYUrpqeb1uLs3eGV6vr21pSqpeWkqonAN9oUyIiXpv8XvlN5e3icY2BkYGAA4n0vN4fG89t8ZeBmYQCBa9wPPRH0/wcsDMwmQC4HAxNIFABAfAqaAHicY2BkYGBu+N/AEMPCAAJAkpEBFbABAEcMAm94nGNhYGBgfsnAwMKAigESnwEBAAAAAAAAdgCkANoBCAFsAAB4nGNgZGBgYGMIZGBlAAEmIOYCQgaG/2A+AwARSAFzAHicZY9NTsMwEIVf+gekEqqoYIfkBWIBKP0Rq25YVGr3XXTfpk6bKokjx63UA3AejsAJOALcgDvwSCebNpbH37x5Y08A3OAHHo7fLfeRPVwyO3INF7gXrlN/EG6QX4SbaONVuEX9TdjHM6bCbXRheYPXuGL2hHdhDx18CNdwjU/hOvUv4Qb5W7iJO/wKt9Dx6sI+5l5XuI1HL/bHVi+cXqnlQcWhySKTOb+CmV7vkoWt0uqca1vEJlODoF9JU51pW91T7NdD5yIVWZOqCas6SYzKrdnq0AUb5/JRrxeJHoQm5Vhj/rbGAo5xBYUlDowxQhhkiMro6DtVZvSvsUPCXntWPc3ndFsU1P9zhQEC9M9cU7qy0nk6T4E9XxtSdXQrbsuelDSRXs1JErJCXta2VELqATZlV44RelzRiT8oZ0j/AAlabsgAAAB4nGNgYoAALgbsgI2RiZGZkYWRlZGNkZ2BsYI1OSM1OZs1OSe/OJW1KDM9o4S9KDWtKLU4g4EBAJ79CeQ=') format('woff'),
|
||||
url('../fonts/iconfont.ttf?t=1508229193188') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
|
||||
url('../fonts/iconfont.svg?t=1508229193188#iconfont') format('svg'); /* iOS 4.1- */
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family:"iconfont" !important;
|
||||
font-size:16px;
|
||||
font-style:normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.icon-check:before { content: "\e645"; }
|
||||
|
||||
.icon-close:before { content: "\e646"; }
|
||||
|
||||
.icon-right:before { content: "\e6a3"; }
|
||||
|
||||
.icon-refresh:before { content: "\e6a4"; }
|
||||
@@ -1,456 +0,0 @@
|
||||
/*!
|
||||
* Viewer.js v1.3.5
|
||||
* https://fengyuanchen.github.io/viewerjs
|
||||
*
|
||||
* Copyright 2015-present Chen Fengyuan
|
||||
* Released under the MIT license
|
||||
*
|
||||
* Date: 2019-07-04T11:00:13.705Z
|
||||
*/
|
||||
|
||||
.viewer-zoom-in::before,
|
||||
.viewer-zoom-out::before,
|
||||
.viewer-one-to-one::before,
|
||||
.viewer-reset::before,
|
||||
.viewer-prev::before,
|
||||
.viewer-play::before,
|
||||
.viewer-next::before,
|
||||
.viewer-rotate-left::before,
|
||||
.viewer-rotate-right::before,
|
||||
.viewer-flip-horizontal::before,
|
||||
.viewer-flip-vertical::before,
|
||||
.viewer-fullscreen::before,
|
||||
.viewer-fullscreen-exit::before,
|
||||
.viewer-close::before {
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAAAUCAYAAABWOyJDAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNui8sowAAAQPSURBVHic7Zs/iFxVFMa/0U2UaJGksUgnIVhYxVhpjDbZCBmLdAYECxsRFBTUamcXUiSNncgKQbSxsxH8gzAP3FU2jY0kKKJNiiiIghFlccnP4p3nPCdv3p9778vsLOcHB2bfveeb7955c3jvvNkBIMdxnD64a94GHMfZu3iBcRynN7zAOI7TG15gHCeeNUkr8zaxG2lbYDYsdgMbktBsP03jdQwljSXdtBhLOmtjowC9Mg9L+knSlcD8TNKpSA9lBpK2JF2VdDSR5n5J64m0qli399hNFMUlpshQii5jbXTbHGviB0nLNeNDSd9VO4A2UdB2fp+x0eCnaXxWXGA2X0au/3HgN9P4LFCjIANOJdrLr0zzZ+BEpNYDwKbpnQMeAw4m8HjQtM6Z9qa917zPQwFr3M5KgA6J5rTJCdFZJj9/lyvGhsDvwFNVuV2MhhjrK6b9bFiE+j1r87eBl4HDwCF7/U/k+ofAX5b/EXBv5JoLMuILzf3Ap6Z3EzgdqHMCuF7hcQf4HDgeoHnccncqdK/TvSDWffFXI/exICY/xZyqc6XLWF1UFZna4gJ7q8BsRvgd2/xXpo6P+D9dfT7PpECtA3cnWPM0GXGFZh/wgWltA+cDNC7X+AP4GzjZQe+k5dRxuYPeiuXU7e1qwLpDz7dFjXKRaSwuMLvAlG8zZlG+YmiK1HoFqT7wP2z+4Q45TfEGcMt01xLoNZEBTwRqD4BLpnMLeC1A41UmVxsXgXeBayV/Wx20rpTyrpnWRft7p6O/FdqzGrDukPNtkaMoMo3FBdBSQMOnYBCReyf05s126fU9ytfX98+mY54Kxnp7S9K3kj6U9KYdG0h6UdLbkh7poFXMfUnSOyVvL0h6VtIXHbS6nOP+s/Zm9mvyXW1uuC9ohZ72E9uDmXWLJOB1GxsH+DxPftsB8B6wlGDN02TAkxG6+4D3TWsbeC5CS8CDFce+AW500LhhOW2020TRjK3b21HEmgti9m0RonxbdMZeVzV+/4tF3cBpP7E9mKHNL5q8h5g0eYsCMQz0epq8gQrwMXAgcs0FGXGFRcB9wCemF9PkbYqM/Bas7fxLwNeJPdTdpo4itQti8lPMqTpXuozVRVXPpbHI3KkNTB1NfkL81j2mvhDp91HgV9MKuRIqrykj3WPq4rHyL+axj8/qGPmTqi6F9YDlHOvJU6oYcTsh/TYSzWmTE6JT19CtLTJt32D6CmHe0eQn1O8z5AXgT4sx4Vcu0/EQecMydB8z0hUWkTd2t4CrwNEePqMBcAR4mrBbwyXLPWJa8zrXmmLEhNBmfpkuY2102xxrih+pb+ieAb6vGhuA97UcJ5KR8gZ77K+99xxeYBzH6Q3/Z0fHcXrDC4zjOL3hBcZxnN74F+zlvXFWXF9PAAAAAElFTkSuQmCC');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 280px;
|
||||
color: transparent;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
height: 20px;
|
||||
line-height: 0;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.viewer-zoom-in::before {
|
||||
background-position: 0 0;
|
||||
content: 'Zoom In';
|
||||
}
|
||||
|
||||
.viewer-zoom-out::before {
|
||||
background-position: -20px 0;
|
||||
content: 'Zoom Out';
|
||||
}
|
||||
|
||||
.viewer-one-to-one::before {
|
||||
background-position: -40px 0;
|
||||
content: 'One to One';
|
||||
}
|
||||
|
||||
.viewer-reset::before {
|
||||
background-position: -60px 0;
|
||||
content: 'Reset';
|
||||
}
|
||||
|
||||
.viewer-prev::before {
|
||||
background-position: -80px 0;
|
||||
content: 'Previous';
|
||||
}
|
||||
|
||||
.viewer-play::before {
|
||||
background-position: -100px 0;
|
||||
content: 'Play';
|
||||
}
|
||||
|
||||
.viewer-next::before {
|
||||
background-position: -120px 0;
|
||||
content: 'Next';
|
||||
}
|
||||
|
||||
.viewer-rotate-left::before {
|
||||
background-position: -140px 0;
|
||||
content: 'Rotate Left';
|
||||
}
|
||||
|
||||
.viewer-rotate-right::before {
|
||||
background-position: -160px 0;
|
||||
content: 'Rotate Right';
|
||||
}
|
||||
|
||||
.viewer-flip-horizontal::before {
|
||||
background-position: -180px 0;
|
||||
content: 'Flip Horizontal';
|
||||
}
|
||||
|
||||
.viewer-flip-vertical::before {
|
||||
background-position: -200px 0;
|
||||
content: 'Flip Vertical';
|
||||
}
|
||||
|
||||
.viewer-fullscreen::before {
|
||||
background-position: -220px 0;
|
||||
content: 'Enter Full Screen';
|
||||
}
|
||||
|
||||
.viewer-fullscreen-exit::before {
|
||||
background-position: -240px 0;
|
||||
content: 'Exit Full Screen';
|
||||
}
|
||||
|
||||
.viewer-close::before {
|
||||
background-position: -260px 0;
|
||||
content: 'Close';
|
||||
}
|
||||
|
||||
.viewer-container {
|
||||
bottom: 0;
|
||||
direction: ltr;
|
||||
font-size: 0;
|
||||
left: 0;
|
||||
line-height: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
top: 0;
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.viewer-container::-moz-selection,
|
||||
.viewer-container *::-moz-selection {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.viewer-container::selection,
|
||||
.viewer-container *::selection {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.viewer-container img {
|
||||
display: block;
|
||||
height: auto;
|
||||
max-height: none !important;
|
||||
max-width: none !important;
|
||||
min-height: 0 !important;
|
||||
min-width: 0 !important;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.viewer-canvas {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.viewer-canvas > img {
|
||||
height: auto;
|
||||
margin: 15px auto;
|
||||
max-width: 90% !important;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.viewer-footer {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.viewer-navbar {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.viewer-list {
|
||||
-webkit-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 50px;
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
padding: 1px 0;
|
||||
}
|
||||
|
||||
.viewer-list > li {
|
||||
color: transparent;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
font-size: 0;
|
||||
height: 50px;
|
||||
line-height: 0;
|
||||
opacity: 0.5;
|
||||
overflow: hidden;
|
||||
-webkit-transition: opacity 0.15s;
|
||||
transition: opacity 0.15s;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.viewer-list > li:hover {
|
||||
opacity: 0.75;
|
||||
}
|
||||
|
||||
.viewer-list > li + li {
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
.viewer-list > .viewer-loading {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.viewer-list > .viewer-loading::after {
|
||||
border-width: 2px;
|
||||
height: 20px;
|
||||
margin-left: -10px;
|
||||
margin-top: -10px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.viewer-list > .viewer-active,
|
||||
.viewer-list > .viewer-active:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.viewer-player {
|
||||
background-color: #000;
|
||||
bottom: 0;
|
||||
cursor: none;
|
||||
display: none;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.viewer-player > img {
|
||||
left: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul {
|
||||
display: inline-block;
|
||||
margin: 0 auto 5px;
|
||||
overflow: hidden;
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > li {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
float: left;
|
||||
height: 24px;
|
||||
overflow: hidden;
|
||||
-webkit-transition: background-color 0.15s;
|
||||
transition: background-color 0.15s;
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > li:hover {
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > li::before {
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > li + li {
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > .viewer-small {
|
||||
height: 18px;
|
||||
margin-bottom: 3px;
|
||||
margin-top: 3px;
|
||||
width: 18px;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > .viewer-small::before {
|
||||
margin: -1px;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > .viewer-large {
|
||||
height: 30px;
|
||||
margin-bottom: -3px;
|
||||
margin-top: -3px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.viewer-toolbar > ul > .viewer-large::before {
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.viewer-tooltip {
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
border-radius: 10px;
|
||||
color: #fff;
|
||||
display: none;
|
||||
font-size: 12px;
|
||||
height: 20px;
|
||||
left: 50%;
|
||||
line-height: 20px;
|
||||
margin-left: -25px;
|
||||
margin-top: -10px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 50%;
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.viewer-title {
|
||||
color: #ccc;
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
line-height: 1;
|
||||
margin: 0 5% 5px;
|
||||
max-width: 90%;
|
||||
opacity: 0.8;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-transition: opacity 0.15s;
|
||||
transition: opacity 0.15s;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.viewer-title:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.viewer-button {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
height: 80px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
right: -40px;
|
||||
top: -40px;
|
||||
-webkit-transition: background-color 0.15s;
|
||||
transition: background-color 0.15s;
|
||||
width: 80px;
|
||||
}
|
||||
|
||||
.viewer-button:focus,
|
||||
.viewer-button:hover {
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
.viewer-button::before {
|
||||
bottom: 15px;
|
||||
left: 15px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.viewer-fixed {
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
.viewer-open {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.viewer-show {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.viewer-hide {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.viewer-backdrop {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.viewer-invisible {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.viewer-move {
|
||||
cursor: move;
|
||||
cursor: -webkit-grab;
|
||||
cursor: grab;
|
||||
}
|
||||
|
||||
.viewer-fade {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.viewer-in {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.viewer-transition {
|
||||
-webkit-transition: all 0.3s;
|
||||
transition: all 0.3s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes viewer-spinner {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes viewer-spinner {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.viewer-loading::after {
|
||||
-webkit-animation: viewer-spinner 1s linear infinite;
|
||||
animation: viewer-spinner 1s linear infinite;
|
||||
border: 4px solid rgba(255, 255, 255, 0.1);
|
||||
border-left-color: rgba(255, 255, 255, 0.5);
|
||||
border-radius: 50%;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
height: 40px;
|
||||
left: 50%;
|
||||
margin-left: -20px;
|
||||
margin-top: -20px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 40px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.viewer-hide-xs-down {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.viewer-hide-sm-down {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.viewer-hide-md-down {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -1,211 +0,0 @@
|
||||
body{ background-color:#fcfcfc;}
|
||||
.grid {
|
||||
position: relative;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.js .grid::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
background-size: 60px auto;
|
||||
-webkit-transition: opacity 0.3s;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
.js .grid--loaded::after {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.grid__item {
|
||||
width: 270px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.grid__item--current {
|
||||
opacity: 0 !important;
|
||||
}
|
||||
|
||||
.img-wrap {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.img-wrap:focus,
|
||||
.img-wrap:hover {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.img-wrap img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.preview {
|
||||
position: fixed;
|
||||
z-index: 1000;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flex;
|
||||
display: flex;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-ms-flex-line-pack: center;
|
||||
-webkit-align-content: center;
|
||||
align-content: center;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.preview--open {
|
||||
pointer-events: auto;
|
||||
}
|
||||
|
||||
|
||||
/* circle overlay (generated SVG) */
|
||||
|
||||
.overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.overlay circle {
|
||||
-webkit-transition: fill-opacity 0.3s, -webkit-transform 0s 0.3s;
|
||||
transition: fill-opacity 0.3s, transform 0s 0.3s;
|
||||
-webkit-transition-timing-function: ease-out;
|
||||
transition-timing-function: ease-out;
|
||||
-webkit-transform: scale3d(0, 0, 1);
|
||||
transform: scale3d(0, 0, 1);
|
||||
fill: #1f1d1d;
|
||||
fill-opacity: 0;
|
||||
}
|
||||
|
||||
.preview--open .overlay circle {
|
||||
-webkit-transition: -webkit-transform 0.4s;
|
||||
transition: transform 0.4s;
|
||||
-webkit-transform: scale3d(1, 1, 1);
|
||||
transform: scale3d(1, 1, 1);
|
||||
fill-opacity: 1;
|
||||
}
|
||||
|
||||
.clone {
|
||||
position: fixed;
|
||||
z-index: 110;
|
||||
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.5, 1, 0.2, 1);
|
||||
transition: transform 0.6s cubic-bezier(0.5, 1, 0.2, 1);
|
||||
-webkit-backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.original {
|
||||
position: relative;
|
||||
z-index: 120;
|
||||
display: block;
|
||||
object-fit: contain;
|
||||
-webkit-transition: opacity 0.2s;
|
||||
transition: opacity 0.2s;
|
||||
-webkit-backface-visibility: hidden;
|
||||
}
|
||||
|
||||
.preview--open .animate {
|
||||
/* open */
|
||||
-webkit-transition: -webkit-transform 0.6s, opacity 0.2s;
|
||||
transition: transform 0.6s, opacity 0.2s;
|
||||
}
|
||||
|
||||
.animate {
|
||||
/* close */
|
||||
-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;
|
||||
transition: transform 0.3s, opacity 0.2s;
|
||||
}
|
||||
|
||||
.description {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.js .description--grid {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.description--preview {
|
||||
position: fixed;
|
||||
z-index: 140;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 2em 1em;
|
||||
text-align: center;
|
||||
opacity: 0;
|
||||
background: linear-gradient(180deg, transparent, #1f1d1d);
|
||||
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
|
||||
transition: opacity 0.3s, transform 0.3s;
|
||||
-webkit-transform: translate3d(0, 100%, 0);
|
||||
transform: translate3d(0, 100%, 0);
|
||||
}
|
||||
|
||||
.preview--open .description--preview {
|
||||
opacity: 1;
|
||||
-webkit-transition-delay: 0.2s;
|
||||
transition-delay: 0.2s;
|
||||
-webkit-transform: translate3d(0, 0, 0);
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
|
||||
|
||||
/* Close button */
|
||||
|
||||
.action {
|
||||
font-size: 1.5em;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
vertical-align: top;
|
||||
color: #6bd68a;
|
||||
border: none;
|
||||
background: none;
|
||||
}
|
||||
|
||||
.action:hover,
|
||||
.action:focus {
|
||||
color: #6bd68a;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.action--close {
|
||||
position: fixed;
|
||||
z-index: 150;
|
||||
top: 0;
|
||||
right: 0;
|
||||
padding: 1em;
|
||||
opacity: 0;
|
||||
-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
|
||||
transition: opacity 0.3s, transform 0.3s;
|
||||
-webkit-transform: scale3d(0.6, 0.6, 1);
|
||||
transform: scale3d(0.6, 0.6, 1);
|
||||
}
|
||||
|
||||
.preview--image-loaded .action--close {
|
||||
opacity: 1;
|
||||
-webkit-transform: scale3d(1, 1, 1);
|
||||
transform: scale3d(1, 1, 1);
|
||||
}
|
||||
|
||||
.text-hidden {
|
||||
position: absolute;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
width: 0;
|
||||
height: 0;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
@@ -1,164 +0,0 @@
|
||||
#verification{
|
||||
margin-top: 100px;
|
||||
}
|
||||
.container{
|
||||
color: #555;
|
||||
}
|
||||
.ghost {
|
||||
position: relative;
|
||||
animation: ghostUpdown 1s infinite alternate;
|
||||
-webkit-animation: ghostUpdown 1s infinite alternate;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.sign-content.popup-in-content{
|
||||
background: #fff;
|
||||
border-radius: 5px;
|
||||
padding: 60px 0 100px;
|
||||
}
|
||||
.popup-in-txt {
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.btn.signin_btn, .btn.signin_btn:focus {
|
||||
width: 90%;
|
||||
padding: 0;
|
||||
height: 50px;
|
||||
background: #5a84fd;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
text-transform: uppercase;
|
||||
border-radius: 3px;
|
||||
box-shadow: 0 5px 30px rgba(0,66,255,.3);
|
||||
margin-top: 23px;
|
||||
margin: 15px;
|
||||
}
|
||||
.container ul{
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
list-style: none;
|
||||
}
|
||||
.container ul li {
|
||||
list-style: none;
|
||||
|
||||
}
|
||||
|
||||
/*=============Style css=========*/
|
||||
.tlinks{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
|
||||
/*-------------------------------------
|
||||
2. Kit-name-head
|
||||
--------------------------------------*/
|
||||
.kit-name-head{
|
||||
display: none;
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.kit-name-txt{
|
||||
/*padding: 75px 0 71px;*/
|
||||
padding: 33px 0 71px;
|
||||
text-align: center;
|
||||
}
|
||||
.kit-name-head h2 {
|
||||
font-size: 33px;
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
margin-bottom: 8px;/*18*/
|
||||
}
|
||||
.kit-name-head h2::first-letter {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
.kit-name-head h3{
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/*-------------------------------------
|
||||
3. Form-demo
|
||||
--------------------------------------*/
|
||||
.single-form-demo-set {
|
||||
text-align: center;
|
||||
padding: 60px 0;
|
||||
}
|
||||
.single-form-img-content { margin-top: 60px;}
|
||||
/*.form-img*/
|
||||
.form-img {
|
||||
position: relative;
|
||||
box-shadow:0px 5px 30px 5px rgba(154,154,154,.3);
|
||||
-webkit-transition: .5s;
|
||||
-moz-transition:.5s;
|
||||
-ms-transition:.5s;
|
||||
-o-transition:.5s;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.form-img-hover{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background:transparent;
|
||||
-webkit-transform: scale(0);
|
||||
-moz-transform:scale(0);
|
||||
-ms-transform:scale(0);
|
||||
-o-transform:scale(0);
|
||||
transform: scale(0);
|
||||
}
|
||||
.form-img:hover .form-img-hover{
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform:scale(1);
|
||||
-ms-transform:scale(1);
|
||||
-o-transform:scale(1);
|
||||
transform: scale(1);
|
||||
-webkit-transition: .5s;
|
||||
-moz-transition:.5s;
|
||||
-ms-transition:.5s;
|
||||
-o-transition:.5s;
|
||||
transition: .5s;
|
||||
}
|
||||
|
||||
.form-img:hover {
|
||||
box-shadow:0px 5px 30px 5px rgba(154,154,154,.7);
|
||||
}
|
||||
/*.form-img*/
|
||||
|
||||
/*===============================
|
||||
Scroll Top
|
||||
===============================*/
|
||||
#scroll-Top .return-to-top {
|
||||
position: fixed;
|
||||
right: 30px;
|
||||
bottom: 30px;
|
||||
display: none;
|
||||
width: 40px;
|
||||
line-height: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
font-size: 30px;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
background:#5a84fd;
|
||||
border:1px solid #5a84fd;
|
||||
border-radius:5px;
|
||||
-webkit-transition: .5s;
|
||||
-moz-transition:.5s;
|
||||
-ms-transition:.5s;
|
||||
-o-transition:.5s;
|
||||
transition: .5s;
|
||||
z-index: 2;
|
||||
}
|
||||
#scroll-Top .return-to-top:hover {
|
||||
background:transparent;
|
||||
color: #26d9b3;
|
||||
border:1px solid #26d9b3;
|
||||
border-radius:50%;
|
||||
}
|
||||
/*========================Thank you=================
|
||||
@@ -1,85 +0,0 @@
|
||||
/*!
|
||||
* classie v1.0.1
|
||||
* class helper functions
|
||||
* from bonzo https://github.com/ded/bonzo
|
||||
* MIT license
|
||||
*
|
||||
* classie.has( elem, 'my-class' ) -> true/false
|
||||
* classie.add( elem, 'my-new-class' )
|
||||
* classie.remove( elem, 'my-unwanted-class' )
|
||||
* classie.toggle( elem, 'my-class' )
|
||||
*/
|
||||
|
||||
/*jshint browser: true, strict: true, undef: true, unused: true */
|
||||
/*global define: false, module: false */
|
||||
|
||||
( function( window ) {
|
||||
|
||||
'use strict';
|
||||
|
||||
// class helper functions from bonzo https://github.com/ded/bonzo
|
||||
|
||||
function classReg( className ) {
|
||||
return new RegExp("(^|\\s+)" + className + "(\\s+|$)");
|
||||
}
|
||||
|
||||
// classList support for class management
|
||||
// altho to be fair, the api sucks because it won't accept multiple classes at once
|
||||
var hasClass, addClass, removeClass;
|
||||
|
||||
if ( 'classList' in document.documentElement ) {
|
||||
hasClass = function( elem, c ) {
|
||||
return elem.classList.contains( c );
|
||||
};
|
||||
addClass = function( elem, c ) {
|
||||
elem.classList.add( c );
|
||||
};
|
||||
removeClass = function( elem, c ) {
|
||||
elem.classList.remove( c );
|
||||
};
|
||||
}
|
||||
else {
|
||||
hasClass = function( elem, c ) {
|
||||
return classReg( c ).test( elem.className );
|
||||
};
|
||||
addClass = function( elem, c ) {
|
||||
if ( !hasClass( elem, c ) ) {
|
||||
elem.className = elem.className + ' ' + c;
|
||||
}
|
||||
};
|
||||
removeClass = function( elem, c ) {
|
||||
elem.className = elem.className.replace( classReg( c ), ' ' );
|
||||
};
|
||||
}
|
||||
|
||||
function toggleClass( elem, c ) {
|
||||
var fn = hasClass( elem, c ) ? removeClass : addClass;
|
||||
fn( elem, c );
|
||||
}
|
||||
|
||||
var classie = {
|
||||
// full names
|
||||
hasClass: hasClass,
|
||||
addClass: addClass,
|
||||
removeClass: removeClass,
|
||||
toggleClass: toggleClass,
|
||||
// short names
|
||||
has: hasClass,
|
||||
add: addClass,
|
||||
remove: removeClass,
|
||||
toggle: toggleClass
|
||||
};
|
||||
|
||||
// transport
|
||||
if ( typeof define === 'function' && define.amd ) {
|
||||
// AMD
|
||||
define( classie );
|
||||
} else if ( typeof exports === 'object' ) {
|
||||
// CommonJS
|
||||
module.exports = classie;
|
||||
} else {
|
||||
// browser global
|
||||
window.classie = classie;
|
||||
}
|
||||
|
||||
})( window );
|
||||
@@ -1 +0,0 @@
|
||||
(function(k,m){var g="3.7.0";var d=k.html5||{};var h=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i;var c=/^(?: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;var q;var i="_html5shiv";var a=0;var o={};var e;(function(){try{var t=m.createElement("a");t.innerHTML="<xyz></xyz>";q=("hidden" in t);e=t.childNodes.length==1||(function(){(m.createElement)("a");var v=m.createDocumentFragment();return(typeof v.cloneNode=="undefined"||typeof v.createDocumentFragment=="undefined"||typeof v.createElement=="undefined")}())}catch(u){q=true;e=true}}());function f(t,v){var w=t.createElement("p"),u=t.getElementsByTagName("head")[0]||t.documentElement;w.innerHTML="x<style>"+v+"</style>";return u.insertBefore(w.lastChild,u.firstChild)}function l(){var t=j.elements;return typeof t=="string"?t.split(" "):t}function p(t){var u=o[t[i]];if(!u){u={};a++;t[i]=a;o[a]=u}return u}function n(w,t,v){if(!t){t=m}if(e){return t.createElement(w)}if(!v){v=p(t)}var u;if(v.cache[w]){u=v.cache[w].cloneNode()}else{if(c.test(w)){u=(v.cache[w]=v.createElem(w)).cloneNode()}else{u=v.createElem(w)}}return u.canHaveChildren&&!h.test(w)?v.frag.appendChild(u):u}function r(v,x){if(!v){v=m}if(e){return v.createDocumentFragment()}x=x||p(v);var y=x.frag.cloneNode(),w=0,u=l(),t=u.length;for(;w<t;w++){y.createElement(u[w])}return y}function s(t,u){if(!u.cache){u.cache={};u.createElem=t.createElement;u.createFrag=t.createDocumentFragment;u.frag=u.createFrag()}t.createElement=function(v){if(!j.shivMethods){return u.createElem(v)}return n(v,t,u)};t.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+l().join().replace(/[\w\-]+/g,function(v){u.createElem(v);u.frag.createElement(v);return'c("'+v+'")'})+");return n}")(j,u.frag)}function b(t){if(!t){t=m}var u=p(t);if(j.shivCSS&&!q&&!u.hasCSS){u.hasCSS=!!f(t,"article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}")}if(!e){s(t,u)}return t}var j={elements:d.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:g,shivCSS:(d.shivCSS!==false),supportsUnknownElements:e,shivMethods:(d.shivMethods!==false),type:"default",shivDocument:b,createElement:n,createDocumentFragment:r};k.html5=j;b(m)}(this,document));
|
||||
@@ -1,364 +0,0 @@
|
||||
/**
|
||||
* cbpGridGallery.js v1.0.0
|
||||
* http://www.codrops.com
|
||||
*
|
||||
* Licensed under the MIT license.
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* Copyright 2014, Codrops
|
||||
* http://www.codrops.com
|
||||
*/
|
||||
;( function( window ) {
|
||||
|
||||
'use strict';
|
||||
|
||||
var docElem = window.document.documentElement,
|
||||
transEndEventNames = {
|
||||
'WebkitTransition': 'webkitTransitionEnd',
|
||||
'MozTransition': 'transitionend',
|
||||
'OTransition': 'oTransitionEnd',
|
||||
'msTransition': 'MSTransitionEnd',
|
||||
'transition': 'transitionend'
|
||||
},
|
||||
transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
|
||||
support = {
|
||||
transitions : Modernizr.csstransitions,
|
||||
support3d : Modernizr.csstransforms3d
|
||||
};
|
||||
|
||||
function setTransform( el, transformStr ) {
|
||||
el.style.WebkitTransform = transformStr;
|
||||
el.style.msTransform = transformStr;
|
||||
el.style.transform = transformStr;
|
||||
}
|
||||
|
||||
// from http://responsejs.com/labs/dimensions/
|
||||
function getViewportW() {
|
||||
var client = docElem['clientWidth'],
|
||||
inner = window['innerWidth'];
|
||||
|
||||
if( client < inner )
|
||||
return inner;
|
||||
else
|
||||
return client;
|
||||
}
|
||||
|
||||
function extend( a, b ) {
|
||||
for( var key in b ) {
|
||||
if( b.hasOwnProperty( key ) ) {
|
||||
a[key] = b[key];
|
||||
}
|
||||
}
|
||||
return a;
|
||||
}
|
||||
|
||||
function CBPGridGallery( el, options ) {
|
||||
this.el = el;
|
||||
this.options = extend( {}, this.options );
|
||||
extend( this.options, options );
|
||||
this._init();
|
||||
}
|
||||
|
||||
CBPGridGallery.prototype.options = {
|
||||
};
|
||||
|
||||
CBPGridGallery.prototype._init = function() {
|
||||
// main grid
|
||||
this.grid = this.el.querySelector( 'section.grid-wrap > ul.grid' );
|
||||
// main grid items
|
||||
this.gridItems = [].slice.call( this.grid.querySelectorAll( 'li:not(.grid-sizer)' ) );
|
||||
// items total
|
||||
this.itemsCount = this.gridItems.length;
|
||||
// slideshow grid
|
||||
this.slideshow = this.el.querySelector( 'section.slideshow > ul' );
|
||||
// slideshow grid items
|
||||
this.slideshowItems = [].slice.call( this.slideshow.children );
|
||||
// index of current slideshow item
|
||||
this.current = -1;
|
||||
// slideshow control buttons
|
||||
this.ctrlPrev = this.el.querySelector( 'section.slideshow > nav > span.nav-prev' );
|
||||
this.ctrlNext = this.el.querySelector( 'section.slideshow > nav > span.nav-next' );
|
||||
this.ctrlClose = this.el.querySelector( 'section.slideshow > nav > span.nav-close' );
|
||||
// init masonry grid
|
||||
this._initMasonry();
|
||||
// init events
|
||||
this._initEvents();
|
||||
};
|
||||
|
||||
CBPGridGallery.prototype._initMasonry = function() {
|
||||
var grid = this.grid;
|
||||
imagesLoaded( grid, function() {
|
||||
new Masonry( grid, {
|
||||
itemSelector: 'li',
|
||||
columnWidth: grid.querySelector( '.grid-sizer' )
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
CBPGridGallery.prototype._initEvents = function() {
|
||||
var self = this;
|
||||
|
||||
// open the slideshow when clicking on the main grid items
|
||||
this.gridItems.forEach( function( item, idx ) {
|
||||
item.addEventListener( 'click', function() {
|
||||
self._openSlideshow( idx );
|
||||
} );
|
||||
} );
|
||||
|
||||
// slideshow controls
|
||||
this.ctrlPrev.addEventListener( 'click', function() { self._navigate( 'prev' ); } );
|
||||
this.ctrlNext.addEventListener( 'click', function() { self._navigate( 'next' ); } );
|
||||
this.ctrlClose.addEventListener( 'click', function() { self._closeSlideshow(); } );
|
||||
|
||||
// window resize
|
||||
window.addEventListener( 'resize', function() { self._resizeHandler(); } );
|
||||
|
||||
// keyboard navigation events
|
||||
document.addEventListener( 'keydown', function( ev ) {
|
||||
if ( self.isSlideshowVisible ) {
|
||||
var keyCode = ev.keyCode || ev.which;
|
||||
|
||||
switch (keyCode) {
|
||||
case 37:
|
||||
self._navigate( 'prev' );
|
||||
break;
|
||||
case 39:
|
||||
self._navigate( 'next' );
|
||||
break;
|
||||
case 27:
|
||||
self._closeSlideshow();
|
||||
break;
|
||||
}
|
||||
}
|
||||
} );
|
||||
|
||||
// trick to prevent scrolling when slideshow is visible
|
||||
window.addEventListener( 'scroll', function() {
|
||||
if ( self.isSlideshowVisible ) {
|
||||
window.scrollTo( self.scrollPosition ? self.scrollPosition.x : 0, self.scrollPosition ? self.scrollPosition.y : 0 );
|
||||
}
|
||||
else {
|
||||
self.scrollPosition = { x : window.pageXOffset || docElem.scrollLeft, y : window.pageYOffset || docElem.scrollTop };
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
CBPGridGallery.prototype._openSlideshow = function( pos ) {
|
||||
this.isSlideshowVisible = true;
|
||||
this.current = pos;
|
||||
|
||||
classie.addClass( this.el, 'slideshow-open' );
|
||||
|
||||
/* position slideshow items */
|
||||
|
||||
// set viewport items (current, next and previous)
|
||||
this._setViewportItems();
|
||||
|
||||
// add class "current" and "show" to currentItem
|
||||
classie.addClass( this.currentItem, 'current' );
|
||||
classie.addClass( this.currentItem, 'show' );
|
||||
|
||||
// add class show to next and previous items
|
||||
// position previous item on the left side and the next item on the right side
|
||||
if( this.prevItem ) {
|
||||
classie.addClass( this.prevItem, 'show' );
|
||||
var translateVal = Number( -1 * ( getViewportW() / 2 + this.prevItem.offsetWidth / 2 ) );
|
||||
setTransform( this.prevItem, support.support3d ? 'translate3d(' + translateVal + 'px, 0, -150px)' : 'translate(' + translateVal + 'px)' );
|
||||
}
|
||||
if( this.nextItem ) {
|
||||
classie.addClass( this.nextItem, 'show' );
|
||||
var translateVal = Number( getViewportW() / 2 + this.nextItem.offsetWidth / 2 );
|
||||
setTransform( this.nextItem, support.support3d ? 'translate3d(' + translateVal + 'px, 0, -150px)' : 'translate(' + translateVal + 'px)' );
|
||||
}
|
||||
};
|
||||
|
||||
CBPGridGallery.prototype._navigate = function( dir ) {
|
||||
if( this.isAnimating ) return;
|
||||
if( dir === 'next' && this.current === this.itemsCount - 1 || dir === 'prev' && this.current === 0 ) {
|
||||
this._closeSlideshow();
|
||||
return;
|
||||
}
|
||||
|
||||
this.isAnimating = true;
|
||||
|
||||
// reset viewport items
|
||||
this._setViewportItems();
|
||||
|
||||
var self = this,
|
||||
itemWidth = this.currentItem.offsetWidth,
|
||||
// positions for the centered/current item, both the side items and the incoming ones
|
||||
transformLeftStr = support.support3d ? 'translate3d(-' + Number( getViewportW() / 2 + itemWidth / 2 ) + 'px, 0, -150px)' : 'translate(-' + Number( getViewportW() / 2 + itemWidth / 2 ) + 'px)',
|
||||
transformRightStr = support.support3d ? 'translate3d(' + Number( getViewportW() / 2 + itemWidth / 2 ) + 'px, 0, -150px)' : 'translate(' + Number( getViewportW() / 2 + itemWidth / 2 ) + 'px)',
|
||||
transformCenterStr = '', transformOutStr, transformIncomingStr,
|
||||
// incoming item
|
||||
incomingItem;
|
||||
|
||||
if( dir === 'next' ) {
|
||||
transformOutStr = support.support3d ? 'translate3d( -' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px, 0, -150px )' : 'translate(-' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px)';
|
||||
transformIncomingStr = support.support3d ? 'translate3d( ' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px, 0, -150px )' : 'translate(' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px)';
|
||||
}
|
||||
else {
|
||||
transformOutStr = support.support3d ? 'translate3d( ' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px, 0, -150px )' : 'translate(' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px)';
|
||||
transformIncomingStr = support.support3d ? 'translate3d( -' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px, 0, -150px )' : 'translate(-' + Number( (getViewportW() * 2) / 2 + itemWidth / 2 ) + 'px)';
|
||||
}
|
||||
|
||||
// remove class animatable from the slideshow grid (if it has already)
|
||||
classie.removeClass( self.slideshow, 'animatable' );
|
||||
|
||||
if( dir === 'next' && this.current < this.itemsCount - 2 || dir === 'prev' && this.current > 1 ) {
|
||||
// we have an incoming item!
|
||||
incomingItem = this.slideshowItems[ dir === 'next' ? this.current + 2 : this.current - 2 ];
|
||||
setTransform( incomingItem, transformIncomingStr );
|
||||
classie.addClass( incomingItem, 'show' );
|
||||
}
|
||||
|
||||
var slide = function() {
|
||||
// add class animatable to the slideshow grid
|
||||
classie.addClass( self.slideshow, 'animatable' );
|
||||
|
||||
// overlays:
|
||||
classie.removeClass( self.currentItem, 'current' );
|
||||
var nextCurrent = dir === 'next' ? self.nextItem : self.prevItem;
|
||||
classie.addClass( nextCurrent, 'current' );
|
||||
|
||||
setTransform( self.currentItem, dir === 'next' ? transformLeftStr : transformRightStr );
|
||||
|
||||
if( self.nextItem ) {
|
||||
setTransform( self.nextItem, dir === 'next' ? transformCenterStr : transformOutStr );
|
||||
}
|
||||
|
||||
if( self.prevItem ) {
|
||||
setTransform( self.prevItem, dir === 'next' ? transformOutStr : transformCenterStr );
|
||||
}
|
||||
|
||||
if( incomingItem ) {
|
||||
setTransform( incomingItem, dir === 'next' ? transformRightStr : transformLeftStr );
|
||||
}
|
||||
|
||||
var onEndTransitionFn = function( ev ) {
|
||||
if( support.transitions ) {
|
||||
if( ev.propertyName.indexOf( 'transform' ) === -1 ) return false;
|
||||
this.removeEventListener( transEndEventName, onEndTransitionFn );
|
||||
}
|
||||
|
||||
if( self.prevItem && dir === 'next' ) {
|
||||
classie.removeClass( self.prevItem, 'show' );
|
||||
}
|
||||
else if( self.nextItem && dir === 'prev' ) {
|
||||
classie.removeClass( self.nextItem, 'show' );
|
||||
}
|
||||
|
||||
if( dir === 'next' ) {
|
||||
self.prevItem = self.currentItem;
|
||||
self.currentItem = self.nextItem;
|
||||
if( incomingItem ) {
|
||||
self.nextItem = incomingItem;
|
||||
}
|
||||
}
|
||||
else {
|
||||
self.nextItem = self.currentItem;
|
||||
self.currentItem = self.prevItem;
|
||||
if( incomingItem ) {
|
||||
self.prevItem = incomingItem;
|
||||
}
|
||||
}
|
||||
|
||||
self.current = dir === 'next' ? self.current + 1 : self.current - 1;
|
||||
self.isAnimating = false;
|
||||
};
|
||||
|
||||
if( support.transitions ) {
|
||||
self.currentItem.addEventListener( transEndEventName, onEndTransitionFn );
|
||||
}
|
||||
else {
|
||||
onEndTransitionFn();
|
||||
}
|
||||
};
|
||||
|
||||
setTimeout( slide, 25 );
|
||||
}
|
||||
|
||||
CBPGridGallery.prototype._closeSlideshow = function( pos ) {
|
||||
// remove class slideshow-open from the grid gallery elem
|
||||
classie.removeClass( this.el, 'slideshow-open' );
|
||||
// remove class animatable from the slideshow grid
|
||||
classie.removeClass( this.slideshow, 'animatable' );
|
||||
|
||||
var self = this,
|
||||
onEndTransitionFn = function( ev ) {
|
||||
if( support.transitions ) {
|
||||
if( ev.target.tagName.toLowerCase() !== 'ul' ) return;
|
||||
this.removeEventListener( transEndEventName, onEndTransitionFn );
|
||||
}
|
||||
// remove classes show and current from the slideshow items
|
||||
classie.removeClass( self.currentItem, 'current' );
|
||||
classie.removeClass( self.currentItem, 'show' );
|
||||
|
||||
if( self.prevItem ) {
|
||||
classie.removeClass( self.prevItem, 'show' );
|
||||
}
|
||||
if( self.nextItem ) {
|
||||
classie.removeClass( self.nextItem, 'show' );
|
||||
}
|
||||
|
||||
// also reset any transforms for all the items
|
||||
self.slideshowItems.forEach( function( item ) { setTransform( item, '' ); } );
|
||||
|
||||
self.isSlideshowVisible = false;
|
||||
};
|
||||
|
||||
if( support.transitions ) {
|
||||
this.el.addEventListener( transEndEventName, onEndTransitionFn );
|
||||
}
|
||||
else {
|
||||
onEndTransitionFn();
|
||||
}
|
||||
};
|
||||
|
||||
CBPGridGallery.prototype._setViewportItems = function() {
|
||||
this.currentItem = null;
|
||||
this.prevItem = null;
|
||||
this.nextItem = null;
|
||||
|
||||
if( this.current > 0 ) {
|
||||
this.prevItem = this.slideshowItems[ this.current - 1 ];
|
||||
}
|
||||
if( this.current < this.itemsCount - 1 ) {
|
||||
this.nextItem = this.slideshowItems[ this.current + 1 ];
|
||||
}
|
||||
this.currentItem = this.slideshowItems[ this.current ];
|
||||
}
|
||||
|
||||
// taken from https://github.com/desandro/vanilla-masonry/blob/master/masonry.js by David DeSandro
|
||||
// original debounce by John Hann
|
||||
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
|
||||
CBPGridGallery.prototype._resizeHandler = function() {
|
||||
var self = this;
|
||||
function delayed() {
|
||||
self._resize();
|
||||
self._resizeTimeout = null;
|
||||
}
|
||||
if ( this._resizeTimeout ) {
|
||||
clearTimeout( this._resizeTimeout );
|
||||
}
|
||||
this._resizeTimeout = setTimeout( delayed, 50 );
|
||||
}
|
||||
|
||||
CBPGridGallery.prototype._resize = function() {
|
||||
if ( this.isSlideshowVisible ) {
|
||||
// update width value
|
||||
if( this.prevItem ) {
|
||||
var translateVal = Number( -1 * ( getViewportW() / 2 + this.prevItem.offsetWidth / 2 ) );
|
||||
setTransform( this.prevItem, support.support3d ? 'translate3d(' + translateVal + 'px, 0, -150px)' : 'translate(' + translateVal + 'px)' );
|
||||
}
|
||||
if( this.nextItem ) {
|
||||
var translateVal = Number( getViewportW() / 2 + this.nextItem.offsetWidth / 2 );
|
||||
setTransform( this.nextItem, support.support3d ? 'translate3d(' + translateVal + 'px, 0, -150px)' : 'translate(' + translateVal + 'px)' );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// add to global namespace
|
||||
window.CBPGridGallery = CBPGridGallery;
|
||||
|
||||
})( window );
|
||||
@@ -1,80 +0,0 @@
|
||||
/*!
|
||||
* classie - class helper functions
|
||||
* from bonzo https://github.com/ded/bonzo
|
||||
*
|
||||
* classie.has( elem, 'my-class' ) -> true/false
|
||||
* classie.add( elem, 'my-new-class' )
|
||||
* classie.remove( elem, 'my-unwanted-class' )
|
||||
* classie.toggle( elem, 'my-class' )
|
||||
*/
|
||||
|
||||
/*jshint browser: true, strict: true, undef: true */
|
||||
/*global define: false */
|
||||
|
||||
( function( window ) {
|
||||
|
||||
'use strict';
|
||||
|
||||
// class helper functions from bonzo https://github.com/ded/bonzo
|
||||
|
||||
function classReg( className ) {
|
||||
return new RegExp("(^|\\s+)" + className + "(\\s+|$)");
|
||||
}
|
||||
|
||||
// classList support for class management
|
||||
// altho to be fair, the api sucks because it won't accept multiple classes at once
|
||||
var hasClass, addClass, removeClass;
|
||||
|
||||
if ( 'classList' in document.documentElement ) {
|
||||
hasClass = function( elem, c ) {
|
||||
return elem.classList.contains( c );
|
||||
};
|
||||
addClass = function( elem, c ) {
|
||||
elem.classList.add( c );
|
||||
};
|
||||
removeClass = function( elem, c ) {
|
||||
elem.classList.remove( c );
|
||||
};
|
||||
}
|
||||
else {
|
||||
hasClass = function( elem, c ) {
|
||||
return classReg( c ).test( elem.className );
|
||||
};
|
||||
addClass = function( elem, c ) {
|
||||
if ( !hasClass( elem, c ) ) {
|
||||
elem.className = elem.className + ' ' + c;
|
||||
}
|
||||
};
|
||||
removeClass = function( elem, c ) {
|
||||
elem.className = elem.className.replace( classReg( c ), ' ' );
|
||||
};
|
||||
}
|
||||
|
||||
function toggleClass( elem, c ) {
|
||||
var fn = hasClass( elem, c ) ? removeClass : addClass;
|
||||
fn( elem, c );
|
||||
}
|
||||
|
||||
var classie = {
|
||||
// full names
|
||||
hasClass: hasClass,
|
||||
addClass: addClass,
|
||||
removeClass: removeClass,
|
||||
toggleClass: toggleClass,
|
||||
// short names
|
||||
has: hasClass,
|
||||
add: addClass,
|
||||
remove: removeClass,
|
||||
toggle: toggleClass
|
||||
};
|
||||
|
||||
// transport
|
||||
if ( typeof define === 'function' && define.amd ) {
|
||||
// AMD
|
||||
define( classie );
|
||||
} else {
|
||||
// browser global
|
||||
window.classie = classie;
|
||||
}
|
||||
|
||||
})( window );
|
||||
@@ -1,347 +0,0 @@
|
||||
;(function(window) {
|
||||
|
||||
'use strict';
|
||||
|
||||
var support = { transitions: Modernizr.csstransitions },
|
||||
// transition end event name
|
||||
transEndEventNames = { 'WebkitTransition': 'webkitTransitionEnd', 'MozTransition': 'transitionend', 'OTransition': 'oTransitionEnd', 'msTransition': 'MSTransitionEnd', 'transition': 'transitionend' },
|
||||
transEndEventName = transEndEventNames[ Modernizr.prefixed( 'transition' ) ],
|
||||
onEndTransition = function( el, callback ) {
|
||||
var onEndCallbackFn = function( ev ) {
|
||||
if( support.transitions ) {
|
||||
if( ev.target != this ) return;
|
||||
this.removeEventListener( transEndEventName, onEndCallbackFn );
|
||||
}
|
||||
if( callback && typeof callback === 'function' ) { callback.call(this); }
|
||||
};
|
||||
if( support.transitions ) {
|
||||
el.addEventListener( transEndEventName, onEndCallbackFn );
|
||||
}
|
||||
else {
|
||||
onEndCallbackFn();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* some helper functions
|
||||
*/
|
||||
|
||||
function throttle(fn, delay) {
|
||||
var allowSample = true;
|
||||
|
||||
return function(e) {
|
||||
if (allowSample) {
|
||||
allowSample = false;
|
||||
setTimeout(function() { allowSample = true; }, delay);
|
||||
fn(e);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function nextSibling(el) {
|
||||
var nextSibling = el.nextSibling;
|
||||
while(nextSibling && nextSibling.nodeType != 1) {
|
||||
nextSibling = nextSibling.nextSibling
|
||||
}
|
||||
return nextSibling;
|
||||
}
|
||||
|
||||
function extend( a, b ) {
|
||||
for( var key in b ) {
|
||||
if( b.hasOwnProperty( key ) ) {
|
||||
a[key] = b[key];
|
||||
}
|
||||
}
|
||||
return a;
|
||||
}
|
||||
|
||||
/**
|
||||
* GridFx obj
|
||||
*/
|
||||
function GridFx(el, options) {
|
||||
this.gridEl = el;
|
||||
this.options = extend( {}, this.options );
|
||||
extend( this.options, options );
|
||||
|
||||
this.items = [].slice.call(this.gridEl.querySelectorAll('.grid__item'));
|
||||
this.previewEl = nextSibling(this.gridEl);
|
||||
this.isExpanded = false;
|
||||
this.isAnimating = false;
|
||||
this.closeCtrl = this.previewEl.querySelector('button.action--close');
|
||||
this.previewDescriptionEl = this.previewEl.querySelector('.description--preview');
|
||||
|
||||
this._init();
|
||||
}
|
||||
|
||||
/**
|
||||
* options
|
||||
*/
|
||||
GridFx.prototype.options = {
|
||||
pagemargin : 0,
|
||||
// x and y can have values from 0 to 1 (percentage). If negative then it means the alignment is left and/or top rather than right and/or bottom
|
||||
// so, as an example, if we want our large image to be positioned vertically on 25% of the screen and centered horizontally the values would be x:1,y:-0.25
|
||||
imgPosition : { x : 1, y : 1 },
|
||||
onInit : function(instance) { return false; },
|
||||
onResize : function(instance) { return false; },
|
||||
onOpenItem : function(instance, item) { return false; },
|
||||
onCloseItem : function(instance, item) { return false; },
|
||||
onExpand : function() { return false; }
|
||||
}
|
||||
|
||||
GridFx.prototype._init = function() {
|
||||
// callback
|
||||
this.options.onInit(this);
|
||||
|
||||
var self = this;
|
||||
// init masonry after all images are loaded
|
||||
imagesLoaded( this.gridEl, function() {
|
||||
// initialize masonry
|
||||
new Masonry(self.gridEl, {
|
||||
itemSelector: '.grid__item',
|
||||
isFitWidth : true
|
||||
});
|
||||
// show grid after all images (thumbs) are loaded
|
||||
classie.add(self.gridEl, 'grid--loaded');
|
||||
// init/bind events
|
||||
self._initEvents();
|
||||
// create the large image and append it to the DOM
|
||||
self._setOriginal();
|
||||
// create the clone image and append it to the DOM
|
||||
self._setClone();
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* initialize/bind events
|
||||
*/
|
||||
GridFx.prototype._initEvents = function () {
|
||||
var self = this,
|
||||
clickEvent = (document.ontouchstart!==null ? 'click' : 'touchstart');
|
||||
|
||||
this.items.forEach(function(item) {
|
||||
var touchend = function(ev) {
|
||||
ev.preventDefault();
|
||||
self._openItem(ev, item);
|
||||
item.removeEventListener('touchend', touchend);
|
||||
},
|
||||
touchmove = function(ev) {
|
||||
item.removeEventListener('touchend', touchend);
|
||||
},
|
||||
manageTouch = function() {
|
||||
item.addEventListener('touchend', touchend);
|
||||
item.addEventListener('touchmove', touchmove);
|
||||
};
|
||||
|
||||
item.addEventListener(clickEvent, function(ev) {
|
||||
if(clickEvent === 'click') {
|
||||
ev.preventDefault();
|
||||
self._openItem(ev, item);
|
||||
}
|
||||
else {
|
||||
manageTouch();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// close expanded image
|
||||
this.closeCtrl.addEventListener('click', function() {
|
||||
self._closeItem();
|
||||
});
|
||||
|
||||
window.addEventListener('resize', throttle(function(ev) {
|
||||
// callback
|
||||
self.options.onResize(self);
|
||||
}, 10));
|
||||
}
|
||||
|
||||
/**
|
||||
* open a grid item
|
||||
*/
|
||||
GridFx.prototype._openItem = function(ev, item) {
|
||||
if( this.isAnimating || this.isExpanded ) return;
|
||||
this.isAnimating = true;
|
||||
this.isExpanded = true;
|
||||
|
||||
// item's image
|
||||
var gridImg = item.querySelector('img'),
|
||||
gridImgOffset = gridImg.getBoundingClientRect();
|
||||
|
||||
// index of current item
|
||||
this.current = this.items.indexOf(item);
|
||||
|
||||
// set the src of the original image element (large image)
|
||||
this._setOriginal(item.querySelector('a').getAttribute('href'));
|
||||
|
||||
// callback
|
||||
this.options.onOpenItem(this, item);
|
||||
|
||||
// set the clone image
|
||||
this._setClone(gridImg.src, {
|
||||
width : gridImg.offsetWidth,
|
||||
height : gridImg.offsetHeight,
|
||||
left : gridImgOffset.left,
|
||||
top : gridImgOffset.top
|
||||
});
|
||||
|
||||
// hide original grid item
|
||||
classie.add(item, 'grid__item--current');
|
||||
|
||||
// calculate the transform value for the clone to animate to the full image view
|
||||
var win = this._getWinSize(),
|
||||
originalSizeArr = item.getAttribute('data-size').split('x'),
|
||||
originalSize = {width: originalSizeArr[0], height: originalSizeArr[1]},
|
||||
dx = ((this.options.imgPosition.x > 0 ? 1-Math.abs(this.options.imgPosition.x) : Math.abs(this.options.imgPosition.x)) * win.width + this.options.imgPosition.x * win.width/2) - gridImgOffset.left - 0.5 * gridImg.offsetWidth,
|
||||
dy = ((this.options.imgPosition.y > 0 ? 1-Math.abs(this.options.imgPosition.y) : Math.abs(this.options.imgPosition.y)) * win.height + this.options.imgPosition.y * win.height/2) - gridImgOffset.top - 0.5 * gridImg.offsetHeight,
|
||||
z = Math.min( Math.min(win.width*Math.abs(this.options.imgPosition.x) - this.options.pagemargin, originalSize.width - this.options.pagemargin)/gridImg.offsetWidth, Math.min(win.height*Math.abs(this.options.imgPosition.y) - this.options.pagemargin, originalSize.height - this.options.pagemargin)/gridImg.offsetHeight );
|
||||
|
||||
// apply transform to the clone
|
||||
this.cloneImg.style.WebkitTransform = 'translate3d(' + dx + 'px, ' + dy + 'px, 0) scale3d(' + z + ', ' + z + ', 1)';
|
||||
this.cloneImg.style.transform = 'translate3d(' + dx + 'px, ' + dy + 'px, 0) scale3d(' + z + ', ' + z + ', 1)';
|
||||
|
||||
// add the description if any
|
||||
var descriptionEl = item.querySelector('.description');
|
||||
if( descriptionEl ) {
|
||||
this.previewDescriptionEl.innerHTML = descriptionEl.innerHTML;
|
||||
}
|
||||
|
||||
var self = this;
|
||||
setTimeout(function() {
|
||||
// controls the elements inside the expanded view
|
||||
classie.add(self.previewEl, 'preview--open');
|
||||
// callback
|
||||
self.options.onExpand();
|
||||
}, 0);
|
||||
|
||||
// after the clone animates..
|
||||
onEndTransition(this.cloneImg, function() {
|
||||
// when the original/large image is loaded..
|
||||
imagesLoaded(self.originalImg, function() {
|
||||
// close button just gets shown after the large image gets loaded
|
||||
classie.add(self.previewEl, 'preview--image-loaded');
|
||||
// animate the opacity to 1
|
||||
self.originalImg.style.opacity = 1;
|
||||
// and once that's done..
|
||||
onEndTransition(self.originalImg, function() {
|
||||
// reset cloneImg
|
||||
self.cloneImg.style.opacity = 0;
|
||||
self.cloneImg.style.WebkitTransform = 'translate3d(0,0,0) scale3d(1,1,1)';
|
||||
self.cloneImg.style.transform = 'translate3d(0,0,0) scale3d(1,1,1)';
|
||||
|
||||
self.isAnimating = false;
|
||||
});
|
||||
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* create/set the original/large image element
|
||||
*/
|
||||
GridFx.prototype._setOriginal = function(src) {
|
||||
if( !src ) {
|
||||
this.originalImg = document.createElement('img');
|
||||
this.originalImg.className = 'original';
|
||||
this.originalImg.style.opacity = 0;
|
||||
this.originalImg.style.maxWidth = 'calc(' + parseInt(Math.abs(this.options.imgPosition.x)*100) + 'vw - ' + this.options.pagemargin + 'px)';
|
||||
this.originalImg.style.maxHeight = 'calc(' + parseInt(Math.abs(this.options.imgPosition.y)*100) + 'vh - ' + this.options.pagemargin + 'px)';
|
||||
// need it because of firefox
|
||||
this.originalImg.style.WebkitTransform = 'translate3d(0,0,0) scale3d(1,1,1)';
|
||||
this.originalImg.style.transform = 'translate3d(0,0,0) scale3d(1,1,1)';
|
||||
src = '';
|
||||
this.previewEl.appendChild(this.originalImg);
|
||||
}
|
||||
|
||||
this.originalImg.setAttribute('src', src);
|
||||
};
|
||||
|
||||
/**
|
||||
* create/set the clone image element
|
||||
*/
|
||||
GridFx.prototype._setClone = function(src, settings) {
|
||||
if( !src ) {
|
||||
this.cloneImg = document.createElement('img');
|
||||
this.cloneImg.className = 'clone';
|
||||
src = '';
|
||||
this.cloneImg.style.opacity = 0;
|
||||
this.previewEl.appendChild(this.cloneImg);
|
||||
}
|
||||
else {
|
||||
this.cloneImg.style.opacity = 1;
|
||||
// set top/left/width/height of grid item's image to the clone
|
||||
this.cloneImg.style.width = settings.width + 'px';
|
||||
this.cloneImg.style.height = settings.height + 'px';
|
||||
this.cloneImg.style.top = settings.top + 'px';
|
||||
this.cloneImg.style.left = settings.left + 'px';
|
||||
}
|
||||
|
||||
this.cloneImg.setAttribute('src', src);
|
||||
};
|
||||
|
||||
/**
|
||||
* closes the original/large image view
|
||||
*/
|
||||
GridFx.prototype._closeItem = function() {
|
||||
if( !this.isExpanded || this.isAnimating ) return;
|
||||
this.isExpanded = false;
|
||||
this.isAnimating = true;
|
||||
|
||||
// the grid item's image and its offset
|
||||
var gridItem = this.items[this.current],
|
||||
gridImg = gridItem.querySelector('img'),
|
||||
gridImgOffset = gridImg.getBoundingClientRect(),
|
||||
self = this;
|
||||
|
||||
classie.remove(this.previewEl, 'preview--open');
|
||||
classie.remove(this.previewEl, 'preview--image-loaded');
|
||||
|
||||
// callback
|
||||
this.options.onCloseItem(this, gridItem);
|
||||
|
||||
// large image will animate back to the position of its grid's item
|
||||
classie.add(this.originalImg, 'animate');
|
||||
|
||||
// set the transform to the original/large image
|
||||
var win = this._getWinSize(),
|
||||
dx = gridImgOffset.left + gridImg.offsetWidth/2 - ((this.options.imgPosition.x > 0 ? 1-Math.abs(this.options.imgPosition.x) : Math.abs(this.options.imgPosition.x)) * win.width + this.options.imgPosition.x * win.width/2),
|
||||
dy = gridImgOffset.top + gridImg.offsetHeight/2 - ((this.options.imgPosition.y > 0 ? 1-Math.abs(this.options.imgPosition.y) : Math.abs(this.options.imgPosition.y)) * win.height + this.options.imgPosition.y * win.height/2),
|
||||
z = gridImg.offsetWidth/this.originalImg.offsetWidth;
|
||||
|
||||
this.originalImg.style.WebkitTransform = 'translate3d(' + dx + 'px, ' + dy + 'px, 0) scale3d(' + z + ', ' + z + ', 1)';
|
||||
this.originalImg.style.transform = 'translate3d(' + dx + 'px, ' + dy + 'px, 0) scale3d(' + z + ', ' + z + ', 1)';
|
||||
|
||||
// once that's done..
|
||||
onEndTransition(this.originalImg, function() {
|
||||
// clear description
|
||||
self.previewDescriptionEl.innerHTML = '';
|
||||
|
||||
// show original grid item
|
||||
classie.remove(gridItem, 'grid__item--current');
|
||||
|
||||
// fade out the original image
|
||||
setTimeout(function() { self.originalImg.style.opacity = 0; }, 60);
|
||||
|
||||
// and after that
|
||||
onEndTransition(self.originalImg, function() {
|
||||
// reset original/large image
|
||||
classie.remove(self.originalImg, 'animate');
|
||||
self.originalImg.style.WebkitTransform = 'translate3d(0,0,0) scale3d(1,1,1)';
|
||||
self.originalImg.style.transform = 'translate3d(0,0,0) scale3d(1,1,1)';
|
||||
|
||||
self.isAnimating = false;
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* gets the window sizes
|
||||
*/
|
||||
GridFx.prototype._getWinSize = function() {
|
||||
return {
|
||||
width: document.documentElement.clientWidth,
|
||||
height: window.innerHeight
|
||||
};
|
||||
};
|
||||
|
||||
window.GridFx = GridFx;
|
||||
|
||||
})(window);
|
||||
@@ -1,3 +0,0 @@
|
||||
/*! modernizr 3.1.0 (Custom Build) | MIT *
|
||||
* http://modernizr.com/download/?-csstransitions-prefixed !*/
|
||||
!function(e,n,t){function r(e,n){return typeof e===n}function o(){var e,n,t,o,s,i,a;for(var f in C){if(e=[],n=C[f],n.name&&(e.push(n.name.toLowerCase()),n.options&&n.options.aliases&&n.options.aliases.length))for(t=0;t<n.options.aliases.length;t++)e.push(n.options.aliases[t].toLowerCase());for(o=r(n.fn,"function")?n.fn():n.fn,s=0;s<e.length;s++)i=e[s],a=i.split("."),1===a.length?Modernizr[a[0]]=o:(!Modernizr[a[0]]||Modernizr[a[0]]instanceof Boolean||(Modernizr[a[0]]=new Boolean(Modernizr[a[0]])),Modernizr[a[0]][a[1]]=o),g.push((o?"":"no-")+a.join("-"))}}function s(e){var n=x.className,t=Modernizr._config.classPrefix||"";if(w&&(n=n.baseVal),Modernizr._config.enableJSClass){var r=new RegExp("(^|\\s)"+t+"no-js(\\s|$)");n=n.replace(r,"$1"+t+"js$2")}Modernizr._config.enableClasses&&(n+=" "+t+e.join(" "+t),w?x.className.baseVal=n:x.className=n)}function i(e){return e.replace(/([a-z])-([a-z])/g,function(e,n,t){return n+t.toUpperCase()}).replace(/^-/,"")}function a(e,n){return!!~(""+e).indexOf(n)}function f(){return"function"!=typeof n.createElement?n.createElement(arguments[0]):w?n.createElementNS.call(n,"http://www.w3.org/2000/svg",arguments[0]):n.createElement.apply(n,arguments)}function l(e,n){return function(){return e.apply(n,arguments)}}function u(e,n,t){var o;for(var s in e)if(e[s]in n)return t===!1?e[s]:(o=n[e[s]],r(o,"function")?l(o,t||n):o);return!1}function p(e){return e.replace(/([A-Z])/g,function(e,n){return"-"+n.toLowerCase()}).replace(/^ms-/,"-ms-")}function d(){var e=n.body;return e||(e=f(w?"svg":"body"),e.fake=!0),e}function c(e,t,r,o){var s,i,a,l,u="modernizr",p=f("div"),c=d();if(parseInt(r,10))for(;r--;)a=f("div"),a.id=o?o[r]:u+(r+1),p.appendChild(a);return s=f("style"),s.type="text/css",s.id="s"+u,(c.fake?c:p).appendChild(s),c.appendChild(p),s.styleSheet?s.styleSheet.cssText=e:s.appendChild(n.createTextNode(e)),p.id=u,c.fake&&(c.style.background="",c.style.overflow="hidden",l=x.style.overflow,x.style.overflow="hidden",x.appendChild(c)),i=t(p,e),c.fake?(c.parentNode.removeChild(c),x.style.overflow=l,x.offsetHeight):p.parentNode.removeChild(p),!!i}function m(n,r){var o=n.length;if("CSS"in e&&"supports"in e.CSS){for(;o--;)if(e.CSS.supports(p(n[o]),r))return!0;return!1}if("CSSSupportsRule"in e){for(var s=[];o--;)s.push("("+p(n[o])+":"+r+")");return s=s.join(" or "),c("@supports ("+s+") { #modernizr { position: absolute; } }",function(e){return"absolute"==getComputedStyle(e,null).position})}return t}function v(e,n,o,s){function l(){p&&(delete P.style,delete P.modElem)}if(s=r(s,"undefined")?!1:s,!r(o,"undefined")){var u=m(e,o);if(!r(u,"undefined"))return u}for(var p,d,c,v,h,y=["modernizr","tspan"];!P.style;)p=!0,P.modElem=f(y.shift()),P.style=P.modElem.style;for(c=e.length,d=0;c>d;d++)if(v=e[d],h=P.style[v],a(v,"-")&&(v=i(v)),P.style[v]!==t){if(s||r(o,"undefined"))return l(),"pfx"==n?v:!0;try{P.style[v]=o}catch(g){}if(P.style[v]!=h)return l(),"pfx"==n?v:!0}return l(),!1}function h(e,n,t,o,s){var i=e.charAt(0).toUpperCase()+e.slice(1),a=(e+" "+b.join(i+" ")+i).split(" ");return r(n,"string")||r(n,"undefined")?v(a,n,o,s):(a=(e+" "+z.join(i+" ")+i).split(" "),u(a,n,t))}function y(e,n,r){return h(e,t,t,n,r)}var g=[],C=[],_={_version:"3.1.0",_config:{classPrefix:"",enableClasses:!0,enableJSClass:!0,usePrefixes:!0},_q:[],on:function(e,n){var t=this;setTimeout(function(){n(t[e])},0)},addTest:function(e,n,t){C.push({name:e,fn:n,options:t})},addAsyncTest:function(e){C.push({name:null,fn:e})}},Modernizr=function(){};Modernizr.prototype=_,Modernizr=new Modernizr;var x=n.documentElement,w="svg"===x.nodeName.toLowerCase(),S="Moz O ms Webkit",b=_._config.usePrefixes?S.split(" "):[];_._cssomPrefixes=b;var E=function(n){var r,o=prefixes.length,s=e.CSSRule;if("undefined"==typeof s)return t;if(!n)return!1;if(n=n.replace(/^@/,""),r=n.replace(/-/g,"_").toUpperCase()+"_RULE",r in s)return"@"+n;for(var i=0;o>i;i++){var a=prefixes[i],f=a.toUpperCase()+"_"+r;if(f in s)return"@-"+a.toLowerCase()+"-"+n}return!1};_.atRule=E;var z=_._config.usePrefixes?S.toLowerCase().split(" "):[];_._domPrefixes=z;var N={elem:f("modernizr")};Modernizr._q.push(function(){delete N.elem});var P={style:N.elem.style};Modernizr._q.unshift(function(){delete P.style}),_.testAllProps=h;_.prefixed=function(e,n,t){return 0===e.indexOf("@")?E(e):(-1!=e.indexOf("-")&&(e=i(e)),n?h(e,n,t):h(e,"pfx"))};_.testAllProps=y,Modernizr.addTest("csstransitions",y("transition","all",!0)),o(),s(g),delete _.addTest,delete _.addAsyncTest;for(var T=0;T<Modernizr._q.length;T++)Modernizr._q[T]();e.Modernizr=Modernizr}(window,document);
|
||||
|
Before Width: | Height: | Size: 105 KiB |
|
Before Width: | Height: | Size: 113 KiB |
|
Before Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 3.2 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 672 B |
|
Before Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 1.7 KiB |
@@ -1 +0,0 @@
|
||||
!function(t){"use strict";function e(e){return this.each(function(){var i=t(this),n=i.data("plugin.backgroundBlur"),o=t.extend({},r.DEFAULTS,i.data(),"object"==typeof e&&e);n||i.data("plugin.backgroundBlur",n=new r(this,o)),"fadeIn"===e?n.fadeIn():"fadeOut"===e?n.fadeOut():"string"==typeof e&&n.generateBlurredImage(e)})}var i=function(){for(var t,e=3,i=document.createElement("div"),n=i.getElementsByTagName("i");i.innerHTML="<!--[if gt IE "+ ++e+"]><i></i><![endif]-->",n[0];);return e>4?e:t}(),n=function(){return"_"+Math.random().toString(36).substr(2,9)},o={svgns:"http://www.w3.org/2000/svg",xlink:"http://www.w3.org/1999/xlink",createElement:function(t,e){var i=document.createElementNS(o.svgns,t);return e&&o.setAttr(i,e),i},setAttr:function(t,e){for(var i in e)"href"===i?t.setAttributeNS(o.xlink,i,e[i]):t.setAttribute(i,e[i]);return t}},r=function(e,i){this.internalID=n(),this.$element=t(e),this.$width=this.$element.width(),this.$height=this.$element.height(),this.element=e,this.options=t.extend({},r.DEFAULTS,i),this.$overlayEl=this.createOverlay(),this.$blurredImage={},this.useVelocity=this.detectVelocity(),this.attachListeners(),this.generateBlurredImage(this.options.imageURL)};r.VERSION="0.0.1",r.DEFAULTS={imageURL:"",blurAmount:10,imageClass:"",overlayClass:"",duration:!1,opacity:1},r.prototype.detectVelocity=function(){return!!window.jQuery.Velocity},r.prototype.attachListeners=function(){this.$element.on("ui.blur.loaded",t.proxy(this.fadeIn,this)),this.$element.on("ui.blur.unload",t.proxy(this.fadeOut,this))},r.prototype.fadeIn=function(){this.options.duration&&this.options.duration>0&&(this.useVelocity?this.$blurredImage.velocity({opacity:this.options.opacity},{duration:this.options.duration}):this.$blurredImage.animate({opacity:this.options.opacity},{duration:this.options.duration}))},r.prototype.fadeOut=function(){this.options.duration&&this.options.duration>0?this.useVelocity?this.$blurredImage.velocity({opacity:0},{duration:this.options.duration}):this.$blurredImage.animate({opacity:0},{duration:this.options.duration}):this.$blurredImage.css({opacity:0})},r.prototype.generateBlurredImage=function(t){var e=this.$blurredImage;this.internalID=n(),e.length>0&&(this.options.duration&&this.options.duration>0?this.useVelocity?e.first().velocity({opacity:0},{duration:this.options.duration,complete:function(){e.remove()}}):e.first().animate({opacity:0},{duration:this.options.duration,complete:function(){e.remove()}}):e.remove()),this.$blurredImage=i?this.createIMG(t,this.$width,this.$height):this.createSVG(t,this.$width,this.$height)},r.prototype.createOverlay=function(){return this.options.overlayClass&&""!==this.options.overlayClass?t("<div></div>").prependTo(this.$element).addClass(this.options.overlayClass):!1},r.prototype.createSVG=function(e,i,n){var r=this,s=o.createElement("svg",{xmlns:o.svgns,version:"1.1",width:i,height:n,id:"blurred"+this.internalID,"class":this.options.imageClass,viewBox:"0 0 "+i+" "+n,preserveAspectRatio:"none"}),a="blur"+this.internalID,u=o.createElement("filter",{id:a}),l=o.createElement("feGaussianBlur",{"in":"SourceGraphic",stdDeviation:this.options.blurAmount}),h=o.createElement("image",{x:0,y:0,width:i,height:n,externalResourcesRequired:"true",href:e,style:"filter:url(#"+a+")",preserveAspectRatio:"none"});h.addEventListener("load",function(){r.$element.trigger("ui.blur.loaded")},!0),h.addEventListener("SVGLoad",function(){r.$element.trigger("ui.blur.loaded")},!0),u.appendChild(l),s.appendChild(u),s.appendChild(h);var d=t(s);return r.options.duration&&r.options.duration>0&&(d.css({opacity:0}),window.setTimeout(function(){"0"===d.css("opacity")&&d.css({opacity:1})},this.options.duration+100)),this.element.insertBefore(s,this.element.firstChild),d},r.prototype.createIMG=function(t,e,i){var n=this,o=this.prependImage(t),r=2*this.options.blurAmount>100?100:2*this.options.blurAmount;return o.css({filter:"progid:DXImageTransform.Microsoft.Blur(pixelradius="+r+") ",top:2.5*-this.options.blurAmount,left:2.5*-this.options.blurAmount,width:e+2.5*this.options.blurAmount,height:i+2.5*this.options.blurAmount}).attr("id","blurred"+this.internalID),o.load(function(){n.$element.trigger("ui.blur.loaded")}),this.options.duration&&this.options.duration>0&&window.setTimeout(function(){"0"===o.css("opacity")&&o.css({opacity:1})},this.options.duration+100),o},r.prototype.prependImage=function(e){var i,n=t('<img src="'+e+'" />');return i=this.$overlayEl?n.insertBefore(this.$overlayEl).attr("id",this.internalID).addClass(this.options.imageClass):n.prependTo(this.$element).attr("id",this.internalID).addClass(this.options.imageClass)};var s=t.fn.backgroundBlur;t.fn.backgroundBlur=e,t.fn.backgroundBlur.Constructor=r,t.fn.backgroundBlur.noConflict=function(){return t.fn.backgroundBlur=s,this}}(jQuery);
|
||||
@@ -1,18 +0,0 @@
|
||||
jQuery.base64=(function($){var _PADCHAR="=",_ALPHA="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/",_VERSION="1.1";function _getbyte64(s,i){var idx=_ALPHA.indexOf(s.charAt(i));if(idx===-1){throw "Cannot decode base64";}
|
||||
return idx;}
|
||||
function _decode_chars(y,x){while(y.length>0){var ch=y[0];if(ch<0x80){y.shift();x.push(String.fromCharCode(ch));}else if((ch&0x80)==0xc0){if(y.length<2)break;ch=y.shift();var ch1=y.shift();x.push(String.fromCharCode(((ch&0x1f)<<6)+(ch1&0x3f)));}else{if(y.length<3)break;ch=y.shift();var ch1=y.shift();var ch2=y.shift();x.push(String.fromCharCode(((ch&0x0f)<<12)+((ch1&0x3f)<<6)+(ch2&0x3f)));}}}
|
||||
function _decode(s){var pads=0,i,b10,imax=s.length,x=[],y=[];s=String(s);if(imax===0){return s;}
|
||||
if(imax%4!==0){throw "Cannot decode base64";}
|
||||
if(s.charAt(imax-1)===_PADCHAR){pads=1;if(s.charAt(imax-2)===_PADCHAR){pads=2;}
|
||||
imax-=4;}
|
||||
for(i=0;i<imax;i+=4){var ch1=_getbyte64(s,i);var ch2=_getbyte64(s,i+1);var ch3=_getbyte64(s,i+2);var ch4=_getbyte64(s,i+3);b10=(_getbyte64(s,i)<<18)|(_getbyte64(s,i+1)<<12)|(_getbyte64(s,i+2)<<6)|_getbyte64(s,i+3);y.push(b10>>16);y.push((b10>>8)&0xff);y.push(b10&0xff);_decode_chars(y,x);}
|
||||
switch(pads){case 1:b10=(_getbyte64(s,i)<<18)|(_getbyte64(s,i+1)<<12)|(_getbyte64(s,i+2)<<6);y.push(b10>>16);y.push((b10>>8)&0xff);break;case 2:b10=(_getbyte64(s,i)<<18)|(_getbyte64(s,i+1)<<12);y.push(b10>>16);break;}
|
||||
_decode_chars(y,x);if(y.length>0)throw "Cannot decode base64";return x.join("");}
|
||||
function _get_chars(ch,y){if(ch<0x80)y.push(ch);else if(ch<0x800){y.push(0xc0+((ch>>6)&0x1f));y.push(0x80+(ch&0x3f));}else{y.push(0xe0+((ch>>12)&0xf));y.push(0x80+((ch>>6)&0x3f));y.push(0x80+(ch&0x3f));}}
|
||||
function _encode(s){if(arguments.length!==1){throw "SyntaxError: exactly one argument required";}
|
||||
s=String(s);if(s.length===0){return s;}
|
||||
var i,b10,y=[],x=[],len=s.length;i=0;while(i<len){_get_chars(s.charCodeAt(i),y);while(y.length>=3){var ch1=y.shift();var ch2=y.shift();var ch3=y.shift();b10=(ch1<<16)|(ch2<<8)|ch3;x.push(_ALPHA.charAt(b10>>18));x.push(_ALPHA.charAt((b10>>12)&0x3F));x.push(_ALPHA.charAt((b10>>6)&0x3f));x.push(_ALPHA.charAt(b10&0x3f));}
|
||||
i++;}
|
||||
switch(y.length){case 1:var ch=y.shift();b10=ch<<16;x.push(_ALPHA.charAt(b10>>18)+_ALPHA.charAt((b10>>12)&0x3F)+_PADCHAR+_PADCHAR);break;case 2:var ch1=y.shift();var ch2=y.shift();b10=(ch1<<16)|(ch2<<8);x.push(_ALPHA.charAt(b10>>18)+_ALPHA.charAt((b10>>12)&0x3F)+_ALPHA.charAt((b10>>6)&0x3f)+_PADCHAR);break;}
|
||||
return x.join("");}
|
||||
return{decode:_decode,encode:_encode,VERSION:_VERSION};}(jQuery));
|
||||
@@ -1,367 +0,0 @@
|
||||
$(function () {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/islogin",
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
if(data.lgoinret==1){
|
||||
bodys(data.username);
|
||||
}else{
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function bodys(username) {
|
||||
var h = '';//<li class="active"><a class="menu-link" data-section="home" data-nav-title="home" data-section-pos="0" data-section-posy="0">'+username+'<i class="fa fa-fw fa-user"></i></a></li>
|
||||
var h1 = '<li><a class="menu-link" target="_blank" href="/admin/goadmin" id="usernames">控制台 <i class="fa fa-fw fa-list"></i></a></li>';
|
||||
var h2 = '<li><a class="menu-link" style="cursor: pointer;" onclick="exit()">退 出 <span class="glyphicon glyphicon-log-out"></span></a></li>';
|
||||
$("#usersrc").html(h + h1 + h2);
|
||||
}
|
||||
|
||||
|
||||
function zhuce(mail, registerusername, registerpassword) {
|
||||
if(zcverification){
|
||||
//验证成功
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/user/register",
|
||||
data: {email: mail, username: registerusername, password: registerpassword,zctmp:zctmp},
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
if (data.ret > 0) {
|
||||
$("#zctishi").text('注册成功');
|
||||
if (data.zctype == 1) {
|
||||
layer.alert('注册成功,请前往邮箱激活你的账号,注意!激活邮件如果迟迟未收到,有可能在您的【垃圾箱】中。', {
|
||||
skin: 'layui-layer-molv'
|
||||
,closeBtn: 0
|
||||
,anim: 1
|
||||
,btn: ['确定']
|
||||
,icon: 1
|
||||
,yes:function(){
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
layer.alert('注册成功,快去登录体验吧。', {
|
||||
skin: 'layui-layer-molv'
|
||||
,closeBtn: 0
|
||||
,anim: 1
|
||||
,btn: ['确定']
|
||||
,icon: 1
|
||||
,yes:function(){
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
if (data.ret == -2) {
|
||||
layer.alert('注册失败,用户名或邮箱重复且用户名只能为字母数字,请重试。', {
|
||||
skin: 'layui-layer-molv'
|
||||
,closeBtn: 0
|
||||
,anim: 1
|
||||
,btn: ['确定']
|
||||
,icon: 2
|
||||
});
|
||||
} else if(data.ret == -3){
|
||||
layer.alert('本站关闭了注册功能。', {
|
||||
skin: 'layui-layer-molv'
|
||||
,closeBtn: 0
|
||||
,anim: 1
|
||||
,btn: ['确定']
|
||||
,icon: 2
|
||||
});
|
||||
}else if(data.ret == -4){
|
||||
layer.alert('非法注册,请刷新页面后重新尝试。', {
|
||||
skin: 'layui-layer-molv'
|
||||
,closeBtn: 0
|
||||
,anim: 1
|
||||
,btn: ['确定']
|
||||
,icon: 2
|
||||
});
|
||||
}else {
|
||||
layer.alert('注册失败,请重试。', {
|
||||
skin: 'layui-layer-molv'
|
||||
,closeBtn: 0
|
||||
,anim: 1
|
||||
,btn: ['确定']
|
||||
,icon: 2
|
||||
});
|
||||
}
|
||||
setTimeout(function () {
|
||||
}, 2000);
|
||||
}
|
||||
again(2);
|
||||
$("#userzc").css('display','block');
|
||||
$("#zctishi").css('display','none');
|
||||
}
|
||||
});
|
||||
}else{
|
||||
shakeModal(6);
|
||||
$("#userzc").css('display','block');
|
||||
$("#zctishi").css('display','none');
|
||||
}
|
||||
}
|
||||
//登录
|
||||
function loginAjax() {
|
||||
var loginemail = $("#loginemail").val();
|
||||
var loginpassword = $("#loginpassword").val();
|
||||
if(verification){
|
||||
//验证成功
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/user/login",
|
||||
data: {email: loginemail, password: loginpassword,logotmp:logotmp},
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
$('#loginModal').modal('hide');
|
||||
if (data == 1) {
|
||||
//toastr.success("登录成功。");
|
||||
//$.cookie('name_hellohaobycookie', loginemail, { expires: 90});
|
||||
//$.cookie('pass_hellohaobycookie', loginpassword, { expires: 90});
|
||||
//$.cookie('Hellohao_UniqueUserKey', loginpassword, { expires: 90});
|
||||
layer.msg('登录成功', {icon: 1});
|
||||
setTimeout(function () {
|
||||
window.location.reload();
|
||||
}, 1000);
|
||||
} else {
|
||||
if (data == -1) {
|
||||
//$('#dlts').text('您的账号是未激活状态,无法登陆。');
|
||||
//toastr.error('您的账号是未激活状态,无法登陆。');
|
||||
layer.msg('此账号是未激活状态,无法登陆', {icon: 4});
|
||||
again();
|
||||
} else if(data==-2){
|
||||
//$('#dlts').text('您的账号已被冻结。');
|
||||
layer.msg('您的账号已被冻结', {icon: 2});
|
||||
again(1);
|
||||
}else if(data==-3){
|
||||
//$('#dlts').text('非法登录,请刷新页面重新尝试。');
|
||||
layer.msg('非法登录,请刷新页面重新尝试', {icon: 2});
|
||||
again(1);
|
||||
}
|
||||
else {
|
||||
//$('#dlts').text('登录失败,你的邮箱或密码不正确');
|
||||
layer.msg('登录失败,邮箱或者密码不正确', {icon: 2});
|
||||
again(1);
|
||||
}
|
||||
setTimeout(function () {
|
||||
//window.location.reload();
|
||||
}, 2000);
|
||||
}
|
||||
}
|
||||
});
|
||||
}else{
|
||||
$('#dlts').text('请滑动验证码进行验证,才可登录。');
|
||||
}
|
||||
}
|
||||
function imgsc() {
|
||||
var str = '输入图片URL地址:';
|
||||
if(isday>0){
|
||||
str = '输入图片URL地址:('+isday+'天后将会自动销毁)';
|
||||
}
|
||||
swal(str, {
|
||||
content: "input",
|
||||
})
|
||||
.then((value) => {
|
||||
var result =value;
|
||||
if(result!=null && result!="" ){
|
||||
urlimg(result);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function copyText() {
|
||||
var data = data = $('#urls').val();
|
||||
var copy = new ClipboardJS('.copytext', {
|
||||
text: function (trigger) {
|
||||
return data;
|
||||
}
|
||||
});
|
||||
copy.on('success', function (e) {
|
||||
layer.msg('复制成功');
|
||||
copy.off("success");
|
||||
});
|
||||
copy.on('error', function (e) {
|
||||
layer.msg('复制失败');
|
||||
copy.off("error");
|
||||
});
|
||||
}
|
||||
|
||||
function loadScriptString(code) {
|
||||
var script = document.createElement("script");
|
||||
script.type = "text/javascript";
|
||||
try {
|
||||
// firefox、safari、chrome和Opera
|
||||
script.appendChild(document.createTextNode(code));
|
||||
} catch (ex) {
|
||||
// IE早期的浏览器 ,需要使用script的text属性来指定javascript代码。
|
||||
script.text = code;
|
||||
}
|
||||
document.getElementsByTagName("head")[0].appendChild(script);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
function urlimg(result) {
|
||||
if(result) {
|
||||
var rx=/^https?:\/\//i;
|
||||
if(rx.test(result)==true){
|
||||
var msgid = layer.msg('上传中..', {
|
||||
icon: 16
|
||||
,shade: 0.01
|
||||
});
|
||||
//qq = GetDateStr(new Date());
|
||||
qq = $('#vu').val();
|
||||
$('#loadingModal').modal({backdrop: 'static', keyboard: false,upurlk:qq});
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/upurlimg",
|
||||
dataType: "json",
|
||||
data: {imgurl: result,setday:isday,upurlk:qq},
|
||||
success: function (data) {
|
||||
layer.close(msgid);
|
||||
for(var i=0;i<data.length;i++){
|
||||
if(data[i]==-1){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('上传失败', '未配置存储源,请先后台配置存储源');
|
||||
}
|
||||
else if(data[i]==-2){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('上传失败', '图片太大或不存在');
|
||||
}
|
||||
else if(data[i]==-3){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('上传失败', '文件类型不符合要求');
|
||||
}
|
||||
else if(data[i]==-4){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('上传失败', '该文件不支持上传');
|
||||
}else if(data[i]==-5){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('上传失败,可用空间不足');
|
||||
}else if(data[i]==403){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('非法调用,请刷新页面后重试');
|
||||
}else if(data[i]==911){
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('你目前不能上传图片,请联系管理员');
|
||||
}else{
|
||||
$('#loadingModal').modal('hide');
|
||||
swal('上传成功', '该图片链接已成功上传');
|
||||
$("#address").css('display', 'block');
|
||||
arr_url += data[i] + '\r\n';
|
||||
arr_markdown += '\r\n';
|
||||
arr_html += '<img src="' + data[i] + '" alt="Image" title="Image" /> \r\n';
|
||||
arr_ddcode +='[img]'+data[i]+'[/img]\r\n';
|
||||
}
|
||||
if(urltypes==1){
|
||||
$("#urls").text(arr_url);
|
||||
}else if(urltypes==2){
|
||||
$("#urls").text(arr_markdown);
|
||||
}else if(urltypes==3){
|
||||
$("#urls").text(arr_html);
|
||||
}else{
|
||||
$("#urls").text(arr_ddcode);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}else{layer.close(msgid);Popups('网址格式错误','网址必须以http(s)://开头。','error');}
|
||||
}
|
||||
}
|
||||
|
||||
function Popups(str1,str2,types) {
|
||||
swal({
|
||||
title: str1,
|
||||
text: str2,
|
||||
type: types,
|
||||
showCancelButton: false,//true显示两个按钮
|
||||
confirmButtonColor: "#A5DC86",
|
||||
confirmButtonText: "知道了",
|
||||
closeOnConfirm: true,
|
||||
closeOnCancel: false
|
||||
});
|
||||
}
|
||||
|
||||
function urltype(urltypes){
|
||||
if(urltypes==1){
|
||||
$("#urls").text(arr_url);
|
||||
}else if(urltypes==2){
|
||||
$("#urls").text(arr_markdown);
|
||||
}else if(urltypes==3){
|
||||
$("#urls").text(arr_html);
|
||||
}else{
|
||||
$("#urls").text(arr_ddcode);
|
||||
}
|
||||
}
|
||||
//获取当前时间
|
||||
function clock(){
|
||||
now = new Date();
|
||||
year = now.getFullYear();
|
||||
month = now.getMonth() + 1;
|
||||
day = now.getDate();
|
||||
today = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];
|
||||
week = today[now.getDay()];
|
||||
hour = now.getHours();
|
||||
min = now.getMinutes();
|
||||
sec = now.getSeconds();
|
||||
if (hour < 10) {
|
||||
hour = "0" + hour;
|
||||
}
|
||||
if (min < 10) {
|
||||
min = "0" + min;
|
||||
}
|
||||
if (sec < 10) {
|
||||
sec = "0" + sec;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
//$("#nian").html(year);
|
||||
//$("#yue").html(month);
|
||||
$("#ri").html(day);
|
||||
$("#shi").html(hour);
|
||||
$("#fen").html(min);
|
||||
$("#miao").html(sec);
|
||||
}
|
||||
|
||||
function xiazai(){
|
||||
swal({
|
||||
title: "即将下载客户端",
|
||||
text: "客户端目前持支Windows系统,其他系统请勿下载。",
|
||||
icon: "success",
|
||||
buttons: true,
|
||||
buttons: ["取消", "下载"],
|
||||
dangerMode: false,
|
||||
})
|
||||
.then((value) => {
|
||||
if (value) {
|
||||
window.open("http://img.wwery.com/HellohaoApps/PC/Hellohao%E5%9B%BE%E5%BA%8A_beta.exe");
|
||||
} else {
|
||||
}
|
||||
});
|
||||
}
|
||||
//回车登录
|
||||
function keyLogin(){
|
||||
if (event.keyCode==13)
|
||||
document.getElementById("dl").click();
|
||||
}
|
||||
|
||||
|
||||
//网站退出
|
||||
function exit() {
|
||||
$.ajax({
|
||||
type: "POST",
|
||||
url: "/user/exit.do",
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
$.cookie('name_hellohaobycookie', null);
|
||||
$.cookie('pass_hellohaobycookie', null);
|
||||
layer.msg('账号已退出', {icon: 1});
|
||||
window.location.reload();
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -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,3 +0,0 @@
|
||||
/*! jquery.cookie v1.4.1 | MIT */
|
||||
!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?a(require("jquery")):a(jQuery)}(function(a){function b(a){return h.raw?a:encodeURIComponent(a)}function c(a){return h.raw?a:decodeURIComponent(a)}function d(a){return b(h.json?JSON.stringify(a):String(a))}function e(a){0===a.indexOf('"')&&(a=a.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\"));try{return a=decodeURIComponent(a.replace(g," ")),h.json?JSON.parse(a):a}catch(b){}}function f(b,c){var d=h.raw?b:e(b);return a.isFunction(c)?c(d):d}var g=/\+/g,h=a.cookie=function(e,g,i){if(void 0!==g&&!a.isFunction(g)){if(i=a.extend({},h.defaults,i),"number"==typeof i.expires){var j=i.expires,k=i.expires=new Date;k.setTime(+k+864e5*j)}return document.cookie=[b(e),"=",d(g),i.expires?"; expires="+i.expires.toUTCString():"",i.path?"; path="+i.path:"",i.domain?"; domain="+i.domain:"",i.secure?"; secure":""].join("")}for(var l=e?void 0:{},m=document.cookie?document.cookie.split("; "):[],n=0,o=m.length;o>n;n++){var p=m[n].split("="),q=c(p.shift()),r=p.join("=");if(e&&e===q){l=f(r,g);break}e||void 0===(r=f(r))||(l[q]=r)}return l};h.defaults={},a.removeCookie=function(b,c){return void 0===a.cookie(b)?!1:(a.cookie(b,"",a.extend({},c,{expires:-1})),!a.cookie(b))}});
|
||||
|
||||
@@ -1,853 +0,0 @@
|
||||
/*
|
||||
AUTHOR : Hitesh Jariwala
|
||||
TEMPLATE : Avail - Creative Coming Soon Template
|
||||
VERSION : 1.0
|
||||
|
||||
TABLE OF CONTENTS
|
||||
1.0 TEMPLATE SETTINGS
|
||||
2.0 FUNCTIONS & PUBLIC VARIABLES
|
||||
2.1 set works container height (only on large devices)
|
||||
2.2 function initialize photo swipe
|
||||
3.0 window.resize FUNCTION
|
||||
3.1 adjust works container height
|
||||
3.2 activate custom scrollbar on works container (only on large devices)
|
||||
4.0 window.load FUNCTION
|
||||
4.1 hide preloader & show home section
|
||||
4.1.1 activate word rotator plugin
|
||||
4.2 show half overlay on home section
|
||||
5.0 window.scroll FUNCTION
|
||||
6.0 document.ready FUNCTION
|
||||
6.1 adjust works container height
|
||||
6.2 show / hide menu button (in small devices) clicked
|
||||
6.3 menu link clicked
|
||||
6.4 show subscribe button clicked
|
||||
6.5 hide subscribe button clicked
|
||||
6.6 check form filled or not
|
||||
6.7 menu list clicked
|
||||
6.8 show menu button clicked (on small devices)
|
||||
6.9 more info button clicked
|
||||
6.10 subscribe button clicked
|
||||
6.11 close subscribe button clicked
|
||||
6.12 activate custom scrollbar on works container (only on large devices)
|
||||
6.13 activate photo swipe
|
||||
6.14 activate slideshow background using backstretch
|
||||
6.15 activate slideshow background with kenburns effect
|
||||
6.16 activate single image background + star effect (constellation)
|
||||
6.17 activate YouTube video background
|
||||
6.18 activate self hosted video background
|
||||
6.19 activate countdown
|
||||
6.20 init 1 column carousel
|
||||
6.21 init home slider
|
||||
6.22 init 3 column carousel
|
||||
6.23 init logo carousel
|
||||
6.24 init google map
|
||||
6.25 validate and submit subscribe form
|
||||
6.26 validate and submit contact us form
|
||||
*/
|
||||
|
||||
(function ($) {
|
||||
"use strict";
|
||||
|
||||
/*-- ================================ --
|
||||
1.0 TEMPLATE SETTINGS
|
||||
/*-- ================================ --*/
|
||||
$.bg_type = 3;
|
||||
/*
|
||||
* 1. Backstretch slideshow background
|
||||
* 2. Slideshow background with Kenburns Effect
|
||||
* 3. Single image background + star effect (constellation)
|
||||
* 4. YouTube video background
|
||||
* 5. Self hosted video background
|
||||
*/
|
||||
$.launch_date = [7, 9, 2016]; //-- launch date [d,m,yyyy], for example 7 September 2016 : [7,9,2016]
|
||||
//$.bg_urls = ["img/background/sample8.jpg"];
|
||||
$.youtube_url = ""; //-- just the last words after https://www.youtube.com/watch?v=
|
||||
$.self_host_video_path = ""; //-- self hosted video path
|
||||
$.self_host_video_filename = ""; //-- self hosted video filename "WITHOUT .MP4 EXTENSION"
|
||||
$.latitude_longitude = [[21.1991367, 72.84016666]]; //-- google map latitude and longitude, $.latitude_longitude = [[latitude,longitude]];
|
||||
$.map_marker_url = "img/marker.png"; //-- Map marker image url
|
||||
$.map_marker_info = '<h6 class="text-darkgrey">Main Office</h6><p class="map-marker-info">Open at 09:00 - 15:00<br>Monday till Saturday</p>';
|
||||
$.enable_wordrotator = true; //-- enabling wordrotator on headline text
|
||||
$.wordrotator_words = ['<h4>也许...</h4>', '<h4>这将是你用过最好用的图床站</h4>']; //-- Array of words, for headline text
|
||||
|
||||
|
||||
/*-- ================================ --
|
||||
2.0 FUNCTIONS & PUBLIC VARIABLES
|
||||
/*-- ================================ --*/
|
||||
$.is_changing_section = false;
|
||||
|
||||
//-- 2.1 set works container height (only on large devices)
|
||||
function InitWorksContHeight() {
|
||||
if ($(window).width() > 768) {
|
||||
var works_height = $(window).height() - 185;
|
||||
var item_margin = ($(window).height() - works_height) * 0.9;
|
||||
|
||||
$('.works-container').height(works_height);
|
||||
$('.works-container .work').css({
|
||||
'margin-top': item_margin,
|
||||
'margin-bottom': item_margin
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//-- 2.2 function initialize photo swipe
|
||||
function InitPhotoSwipe(current_index) {
|
||||
var pswpElement = document.querySelectorAll('.pswp')[0];
|
||||
|
||||
//-- build items array
|
||||
var items = [];
|
||||
|
||||
$('.works-container').find('.work').each(function (index, element) {
|
||||
var value = {
|
||||
src: $(this).find('.icon-link').attr('href'),
|
||||
w: 2500,
|
||||
h: 1500,
|
||||
title: $(this).find('.icon-link').data('title')
|
||||
};
|
||||
|
||||
items.push(value);
|
||||
});
|
||||
|
||||
//-- define options
|
||||
var options = {
|
||||
index: current_index,
|
||||
showHideOpacity: true,
|
||||
getThumbBoundsFn: false,
|
||||
shareEl: false
|
||||
};
|
||||
|
||||
var gallery = new PhotoSwipe(pswpElement, PhotoSwipeUI_Default, items, options);
|
||||
gallery.init();
|
||||
}
|
||||
|
||||
/*-- ================================ --
|
||||
3.0 window.resize FUNCTION
|
||||
/*-- ================================ --*/
|
||||
$(window).resize(function (e) {
|
||||
//-- 3.1 adjust works container height
|
||||
InitWorksContHeight();
|
||||
|
||||
//-- 3.2 activate custom scrollbar on works container (only on large devices)
|
||||
if ($(window).width() > 768) {
|
||||
$(".works-container").mCustomScrollbar({
|
||||
theme: "minimal",
|
||||
scrollInertia: 500,
|
||||
alwaysShowScrollbar: 2
|
||||
});
|
||||
}
|
||||
});
|
||||
//-- end window.resize function
|
||||
|
||||
/*-- ================================ --
|
||||
4.0 window.load FUNCTION
|
||||
/*-- ================================ --*/
|
||||
//$(window).load(function (e) {
|
||||
$(window).ready(function (e) {
|
||||
//-- 4.1 hide preloader & show home section
|
||||
var delay = setTimeout(function () {
|
||||
$('.preloader-container').addClass('is-hidden');
|
||||
$('.page-container').addClass('is-visible');
|
||||
//-- show logo, menu & home section content
|
||||
$('.img-logo, nav, .home-section .left-side, .home-section .right-side').addClass('is-visible');
|
||||
|
||||
//-- 4.1.1 activate word rotator plugin
|
||||
if ($.enable_wordrotator) {
|
||||
$("#wordsrotator").wordsrotator({
|
||||
autoLoop: true, //-- auto rotate words
|
||||
randomize: false, //-- show random entries from the words array
|
||||
stopOnHover: false, //-- stop animation on hover
|
||||
changeOnClick: false, //-- force animation run on click
|
||||
animationIn: "fadeInDown", //-- css class for entrace animation
|
||||
animationOut: "fadeOutUp", //-- css class for exit animation
|
||||
speed: 4000, //-- delay in milliseconds between two words
|
||||
words: $.wordrotator_words //-- Array of words, it may contain HTML values
|
||||
});
|
||||
}
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1000);
|
||||
|
||||
//-- 4.2 show half overlay on home section
|
||||
var show_half_overlay = setTimeout(function () {
|
||||
$('.home-section').find('.half-overlay').addClass('is-visible');
|
||||
$('#webtext').addClass('fadeInDown');
|
||||
clearTimeout(this);
|
||||
}, 2300);
|
||||
});
|
||||
//-- end window.load function
|
||||
|
||||
/*-- ================================ --
|
||||
5.0 window.scroll FUNCTION
|
||||
/*-- ================================ --*/
|
||||
$(window).scroll(function (e) {
|
||||
|
||||
});
|
||||
//-- end window.scroll function
|
||||
|
||||
|
||||
/*-- ================================ --
|
||||
6.0 document.ready FUNCTION
|
||||
/*-- ================================ --*/
|
||||
$(document).ready(function (e) {
|
||||
//-- 6.1 adjust works container height
|
||||
InitWorksContHeight();
|
||||
|
||||
//-- 6.2 show / hide menu button (in small devices) clicked
|
||||
$('.menu-button-phone').on('click', function () {
|
||||
if ($('nav.small-device ul').hasClass('is-visible')) {
|
||||
$('nav.small-device ul').removeClass('is-visible');
|
||||
}
|
||||
else {
|
||||
$('nav.small-device ul').addClass('is-visible');
|
||||
}
|
||||
});
|
||||
|
||||
//-- 6.3 menu link clicked
|
||||
$('.menu-link').on('click', function () {
|
||||
//-- set new active menu
|
||||
$('nav').find('.active').removeClass('active');
|
||||
$(this).addClass('active');
|
||||
|
||||
//-- slide the section-container
|
||||
var current_section = $(this).data('section');
|
||||
var section_pos = $(this).data('section-pos');
|
||||
var section_posy = $(this).data('section-posy');
|
||||
|
||||
$('.section-container').css({
|
||||
'transform': 'translate(' + section_pos + '%,' + section_posy + '%)'
|
||||
});
|
||||
|
||||
//-- hide & show the half overlay
|
||||
$('section').each(function (index, element) {
|
||||
$(this).find('.half-overlay').removeClass('is-visible');
|
||||
});
|
||||
$('.' + current_section + '-section').find('.half-overlay').addClass('is-visible');
|
||||
|
||||
//-- hide the menu & change nav-title (only on small devices)
|
||||
if ($(window).width() < 769) {
|
||||
$('nav.small-device ul').removeClass('is-visible');
|
||||
|
||||
$('nav.small-device .nav-title').html($('nav.small-device ul').find('.active').data('nav-title'));
|
||||
}
|
||||
});
|
||||
|
||||
//-- 6.4 show subscribe button clicked
|
||||
$('.show-subscribe').on('click', function () {
|
||||
$('.subscribe-popup').addClass('is-visible');
|
||||
});
|
||||
|
||||
//-- 6.5 hide subscribe button clicked
|
||||
$('.hide-subscribe').on('click', function () {
|
||||
$('.subscribe-popup').removeClass('is-visible');
|
||||
});
|
||||
|
||||
//-- 6.6 check form filled or not
|
||||
$('input, textarea').on('focusout', function () {
|
||||
if ($(this).val() != "" && $(this).val() != " ") {
|
||||
$(this).addClass('filled');
|
||||
}
|
||||
else {
|
||||
$(this).removeClass('filled');
|
||||
}
|
||||
});
|
||||
|
||||
//-- 6.7 menu list clicked
|
||||
$('.menu-list').find('a').each(function (index, element) {
|
||||
$(this).on('click', function () {
|
||||
if (!$.is_changing_section && !$(this).hasClass('active')) {
|
||||
//-- change section
|
||||
ChangeSection($(this));
|
||||
|
||||
//-- hide menu list (only on extra small devices)
|
||||
if ($(window).width() < 769) {
|
||||
$('ul.menu-list').css({
|
||||
height: 52
|
||||
});
|
||||
$('.menu-bg').css({
|
||||
height: 108
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
//-- 6.8 show menu button clicked (on small devices)
|
||||
$('a.show-menu').on('click', function () {
|
||||
if ($('ul.menu-list').height() == 52) {
|
||||
$('ul.menu-list').css({
|
||||
height: 245
|
||||
});
|
||||
$('.menu-bg').css({
|
||||
height: 298
|
||||
});
|
||||
}
|
||||
else {
|
||||
$('ul.menu-list').css({
|
||||
height: 52
|
||||
});
|
||||
$('.menu-bg').css({
|
||||
height: 108
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
//-- 6.9 more info button clicked
|
||||
$('.more-info-button').on('click', function () {
|
||||
//-- show about-section
|
||||
ChangeSection($(this));
|
||||
});
|
||||
|
||||
//-- 6.10 subscribe button clicked
|
||||
$('.subscribe-button').on('click', function () {
|
||||
//-- show subscribe section
|
||||
$('.page-container .section-container').css({
|
||||
transform: 'translate(-100%,100%)'
|
||||
});
|
||||
|
||||
//-- change bg-container darkness
|
||||
$('.bg-container').addClass('dark');
|
||||
});
|
||||
|
||||
//-- 6.11 close subscribe button clicked
|
||||
$('.close-subscribe-button .close-button').on('click', function () {
|
||||
//-- show home section again
|
||||
$('.page-container .section-container').css({
|
||||
transform: 'translate(0%,0%)'
|
||||
});
|
||||
|
||||
//-- change bg-container darkness
|
||||
$('.bg-container').removeClass('dark');
|
||||
});
|
||||
|
||||
//-- 6.12 activate custom scrollbar on works container (only on large devices)
|
||||
if ($(window).width() > 768) {
|
||||
$(".works-container").mCustomScrollbar({
|
||||
theme: "minimal",
|
||||
scrollInertia: 500,
|
||||
alwaysShowScrollbar: 2
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.13 activate photo swipe
|
||||
$('.works-container').find('.icon-link').each(function (index, element) {
|
||||
$(this).on('click', function (e) {
|
||||
e.preventDefault();
|
||||
|
||||
//-- get index
|
||||
var index = $(this).parent().parent().index();
|
||||
|
||||
//-- activate photo swipe
|
||||
InitPhotoSwipe(index);
|
||||
});
|
||||
});
|
||||
|
||||
//-- 6.14 activate slideshow background using backstretch
|
||||
if ($.bg_type == 1) {
|
||||
$(".bg-container").backstretch($.bg_urls, {
|
||||
duration: 6000,
|
||||
fade: 'normal'
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.15 activate slideshow background with kenburns effect
|
||||
else if ($.bg_type == 2) {
|
||||
var i = 0;
|
||||
for (i; i < $.bg_urls.length; i++) {
|
||||
var html_code = '<img src="' + $.bg_urls[i] + '" alt="bg-' + i + '" />';
|
||||
|
||||
//-- append image to bg-container
|
||||
$('.bg-container').append(html_code);
|
||||
}
|
||||
|
||||
//-- activate kenburns
|
||||
$(".bg-container").kenburnsy({
|
||||
fullscreen: true
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.16 activate single image background + star effect (constellation)
|
||||
else if ($.bg_type == 3) {
|
||||
$(".bg-container").backstretch([
|
||||
$.bg_urls
|
||||
], {
|
||||
duration: 6000,
|
||||
fade: 'normal'
|
||||
});
|
||||
$(".bg-container-static").backstretch([
|
||||
$.bg_urls
|
||||
], {
|
||||
duration: 6000,
|
||||
fade: 'normal'
|
||||
});
|
||||
|
||||
var canvas = '<canvas id="bg-canvas"> </canvas>';
|
||||
$('.bg-container').prepend(canvas);
|
||||
|
||||
//-- init star effect
|
||||
if ($(window).width() < 700) {
|
||||
$('canvas').constellation({
|
||||
distance: 40,
|
||||
star: {
|
||||
color: 'rgba(255, 255, 255, .7)',
|
||||
width: 1
|
||||
},
|
||||
line: {
|
||||
color: 'rgba(0, 0, 0, .7)',
|
||||
width: 0.2
|
||||
}
|
||||
});
|
||||
}
|
||||
else {
|
||||
$('canvas').constellation({
|
||||
star: {
|
||||
color: 'rgba(255, 255, 255, .7)',
|
||||
width: 1
|
||||
},
|
||||
line: {
|
||||
color: 'rgba(0, 0, 0, .7)',
|
||||
width: 0.2
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//-- 6.17 activate YouTube video background
|
||||
else if ($.bg_type == 4) {
|
||||
//-- put the video to the body
|
||||
var vid_elem = '<a id="video" class="player" data-property="{videoURL:\'' + $.youtube_url + '\',containment:\'.bg-container\', showControls:false, autoPlay:true, loop:true, mute:true, startAt:0, opacity:1, addRaster:false, quality:\'large\'}"></a>';
|
||||
|
||||
$('body').prepend(vid_elem);
|
||||
|
||||
//-- activate plugin
|
||||
if ($(window).width() >= 1200) {
|
||||
/*
|
||||
* Please note that this player doesn’t work as background for small devices (smartphone) due to the restriction policy adopted by all on
|
||||
* managing multimedia files via javascript. It fallsback to the default Youtube player if used as player (not applied to the body). You
|
||||
* could set the fallback background by initializing the "$.bg_urls" variable in the TEMPLATE
|
||||
* SETTINGS
|
||||
*/
|
||||
|
||||
$('.player').mb_YTPlayer();
|
||||
}
|
||||
else {
|
||||
$(".bg-container").backstretch([
|
||||
$.bg_urls
|
||||
], {
|
||||
duration: 6000,
|
||||
fade: 'normal'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//-- 6.18 activate self hosted video background
|
||||
else if ($.bg_type == 5) {
|
||||
//-- activate plugin
|
||||
if ($(window).width() >= 1200) {
|
||||
/*
|
||||
* Please note that this plugin doesn’t work as background for small devices (smartphone) due to the restriction policy adopted by all on
|
||||
* managing multimedia files via javascript. You could set the fallback background by initializing the "$.bg_urls" variable in the TEMPLATE
|
||||
* SETTINGS
|
||||
*/
|
||||
|
||||
var videobackground = new $.backgroundVideo($('.bg-container'), {
|
||||
"align": "centerXY",
|
||||
"width": 1280,
|
||||
"height": 720,
|
||||
"path": $.self_host_video_path,
|
||||
"filename": $.self_host_video_filename,
|
||||
"types": ["mp4"]
|
||||
});
|
||||
}
|
||||
else {
|
||||
$(".bg-container").backstretch([
|
||||
$.bg_urls
|
||||
], {
|
||||
duration: 6000,
|
||||
fade: 'normal'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//-- 6.19 activate countdown
|
||||
if ($('#countdown').is(':visible')) {
|
||||
$('#countdown').countDown({
|
||||
targetDate: {
|
||||
'day': $.launch_date[0],
|
||||
'month': $.launch_date[1],
|
||||
'year': $.launch_date[2],
|
||||
'hour': 0,
|
||||
'min': 0,
|
||||
'sec': 0
|
||||
},
|
||||
omitWeeks: true
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.20 init 1 column carousel
|
||||
if ($('.carousel-col-1').is(':visible')) {
|
||||
$('.carousel-col-1').each(function (index, element) {
|
||||
$(this).owlCarousel({
|
||||
navigation: false,
|
||||
slideSpeed: 300,
|
||||
paginationSpeed: 400,
|
||||
singleItem: true,
|
||||
autoHeight: false,
|
||||
autoPlay: 4000
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.21 init home slider
|
||||
if ($('.home-slider').is(':visible')) {
|
||||
$('.home-slider').owlCarousel({
|
||||
singleItem: true,
|
||||
navigation: false,
|
||||
pagination: true,
|
||||
mouseDrag: false,
|
||||
touchDrag: false,
|
||||
autoPlay: 6000,
|
||||
addClassActive: true,
|
||||
transitionStyle: "fade",
|
||||
afterAction: function () {
|
||||
if ($(window).width() < 768) {
|
||||
//-- move pagination
|
||||
$('.owl-controls').insertAfter('.owl-item.active .text-container .headline-desc');
|
||||
|
||||
//-- hide navigation background
|
||||
$('.menu-small-device').removeClass('is-visible');
|
||||
|
||||
//-- set scroll top to 0
|
||||
$('.home-slider .text-container').scrollTop(0);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.22 init 3 column carousel
|
||||
if ($('.carousel-col-3').is(':visible')) {
|
||||
$('.carousel-col-3').each(function (index, element) {
|
||||
$(this).owlCarousel({
|
||||
items: 3,
|
||||
itemsDesktop: [1199, 3],
|
||||
itemsDesktopSmall: [1025, 2],
|
||||
itemsTablet: [768, 2],
|
||||
itemsMobile: [600, 1],
|
||||
navigation: false,
|
||||
slideSpeed: 300,
|
||||
paginationSpeed: 400
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.23 init logo carousel
|
||||
if ($('.logo-carousel').is(':visible')) {
|
||||
$('.logo-carousel').each(function (index, element) {
|
||||
$(this).owlCarousel({
|
||||
items: 4,
|
||||
itemsDesktop: [1199, 4],
|
||||
itemsDesktopSmall: [1025, 3],
|
||||
itemsTablet: [768, 2],
|
||||
slideSpeed: 300,
|
||||
autoPlay: 3000,
|
||||
pagination: false,
|
||||
navigation: true,
|
||||
paginationSpeed: 400
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
//-- 6.24 init google map
|
||||
if ($('#map').is(':visible')) {
|
||||
var map = new google.maps.Map(document.getElementById('map'), {
|
||||
zoom: 15,
|
||||
scrollwheel: false,
|
||||
navigationControl: true,
|
||||
mapTypeControl: false,
|
||||
scaleControl: false,
|
||||
draggable: true,
|
||||
disableDefaultUI: false,
|
||||
styles: [{ "featureType": "administrative", "elementType": "all", "stylers": [{ "visibility": "on" }, { "lightness": 33}] }, { "featureType": "landscape", "elementType": "all", "stylers": [{ "color": "#f2e5d4"}] }, { "featureType": "poi.park", "elementType": "geometry", "stylers": [{ "color": "#c5dac6"}] }, { "featureType": "poi.park", "elementType": "labels", "stylers": [{ "visibility": "on" }, { "lightness": 20}] }, { "featureType": "road", "elementType": "all", "stylers": [{ "lightness": 20}] }, { "featureType": "road.highway", "elementType": "geometry", "stylers": [{ "color": "#c5c6c6"}] }, { "featureType": "road.arterial", "elementType": "geometry", "stylers": [{ "color": "#e4d7c6"}] }, { "featureType": "road.local", "elementType": "geometry", "stylers": [{ "color": "#fbfaf7"}] }, { "featureType": "water", "elementType": "all", "stylers": [{ "visibility": "on" }, { "color": "#acbcc9"}]}],
|
||||
center: new google.maps.LatLng($.latitude_longitude[0][0], $.latitude_longitude[0][1]),
|
||||
mapTypeId: google.maps.MapTypeId.ROADMAP
|
||||
});
|
||||
var marker = new google.maps.Marker({
|
||||
position: new google.maps.LatLng($.latitude_longitude[0][0], $.latitude_longitude[0][1]),
|
||||
map: map,
|
||||
icon: $.map_marker_url
|
||||
});
|
||||
var infowindow = new google.maps.InfoWindow({
|
||||
content: $.map_marker_info
|
||||
});
|
||||
google.maps.event.addListener(marker, 'click', function () {
|
||||
infowindow.open(map, marker);
|
||||
});
|
||||
}
|
||||
//-- end init google map
|
||||
|
||||
//-- 6.25 validate and submit subscribe form
|
||||
$('.subscribe-form').validate({
|
||||
rules: {
|
||||
EMAIL: {
|
||||
required: true,
|
||||
email: true
|
||||
}
|
||||
},
|
||||
messages: {
|
||||
EMAIL: {
|
||||
required: "Please insert your email address",
|
||||
email: "Your email address is not valid"
|
||||
}
|
||||
},
|
||||
highlight: function (element, errorClass, validClass) {
|
||||
$(element).parent().addClass('form-error');
|
||||
},
|
||||
unhighlight: function (element, errorClass, validClass) {
|
||||
$(element).parent().removeClass('form-error');
|
||||
},
|
||||
errorPlacement: function (error, element) {
|
||||
|
||||
},
|
||||
submitHandler: function (form) {
|
||||
var url_dest = $(form).attr('action');
|
||||
var form_data = $(form).serialize();
|
||||
var form_method = $(form).attr('method');
|
||||
|
||||
//-- show loading
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="loading">Please wait</label>').addClass('is-visible');
|
||||
|
||||
$.ajax({
|
||||
type: form_method,
|
||||
url: url_dest,
|
||||
data: form_data,
|
||||
cache: false,
|
||||
dataType: 'json',
|
||||
contentType: "application/json; charset=utf-8",
|
||||
error: function (err) {
|
||||
//-- reset form
|
||||
$(form).trigger('reset');
|
||||
|
||||
//-- set element to focusout and remove error class
|
||||
$('.subscribe-email').focusout();
|
||||
$(form).find('.form-error').removeClass('form-error');
|
||||
|
||||
//-- hide loading
|
||||
var wait_loading = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1000);
|
||||
|
||||
//-- show notif error
|
||||
var show_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="notif-error">Could not connect to the registration server. Please try again later.</label>');
|
||||
$(form).find('.form-notif').addClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1500);
|
||||
|
||||
//-- wait 5 seconds and then hide the notification
|
||||
var hide_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 7000);
|
||||
},
|
||||
success: function (data) {
|
||||
if (data.result == "success") {
|
||||
//-- reset form
|
||||
$(form).trigger('reset');
|
||||
$(form).find('.filled').each(function (index, element) {
|
||||
$(this).removeClass('filled');
|
||||
});
|
||||
|
||||
//-- set element to focusout and remove error class
|
||||
$('.subscribe-email').focusout();
|
||||
$(form).find('.form-error').removeClass('form-error');
|
||||
|
||||
//-- hide loading
|
||||
var wait_loading = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1000);
|
||||
|
||||
//-- show notif success
|
||||
var show_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="notif-success">Thank you for subscribing us.</label>');
|
||||
$(form).find('.form-notif').addClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1500);
|
||||
|
||||
//-- wait 5 seconds and then hide the notification
|
||||
var hide_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 7000);
|
||||
}
|
||||
else {
|
||||
//-- reset form
|
||||
$(form).trigger('reset');
|
||||
$(form).find('.filled').each(function (index, element) {
|
||||
$(this).removeClass('filled');
|
||||
});
|
||||
|
||||
//-- set element to focusout and remove error class
|
||||
$('.subscribe-email').focusout();
|
||||
$(form).find('.form-error').removeClass('form-error');
|
||||
|
||||
//-- hide loading
|
||||
var wait_loading = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1000);
|
||||
|
||||
//-- show notif error
|
||||
var show_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="notif-error">Error</label>');
|
||||
$(form).find('.form-notif').addClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1500);
|
||||
|
||||
//-- wait 5 seconds and then hide the notification
|
||||
var hide_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 7000);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return false;
|
||||
}
|
||||
});
|
||||
//-- end validate and submit subscribe form
|
||||
|
||||
|
||||
//-- 6.26 validate and submit contact us form
|
||||
$('.contact-form').validate({
|
||||
rules: {
|
||||
email: {
|
||||
required: true,
|
||||
email: true
|
||||
},
|
||||
subject: {
|
||||
required: true
|
||||
},
|
||||
name: {
|
||||
required: true
|
||||
},
|
||||
message: {
|
||||
required: true
|
||||
}
|
||||
},
|
||||
highlight: function (element, errorClass, validClass) {
|
||||
$(element).parent().addClass('form-error');
|
||||
},
|
||||
unhighlight: function (element, errorClass, validClass) {
|
||||
$(element).parent().removeClass('form-error');
|
||||
},
|
||||
errorPlacement: function (error, element) {
|
||||
|
||||
},
|
||||
submitHandler: function (form) {
|
||||
var url_dest = $(form).attr('action');
|
||||
var form_data = $(form).serialize();
|
||||
|
||||
//-- show loading
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="loading">Please wait</label>').addClass('is-visible');
|
||||
|
||||
$.post(url_dest, form_data, function (data) {
|
||||
var success = data;
|
||||
|
||||
if (success) {
|
||||
//-- reset form
|
||||
$(form).trigger('reset');
|
||||
$(form).find('.filled').each(function (index, element) {
|
||||
$(this).removeClass('filled');
|
||||
});
|
||||
|
||||
//-- hide loading
|
||||
var wait_loading = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1000);
|
||||
|
||||
//-- show notif success
|
||||
var show_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="notif-success">Thank you for contacting us. We will reply you shortly.</label>');
|
||||
$(form).find('.form-notif').addClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1500);
|
||||
|
||||
//-- wait 5 seconds and then hide the notification
|
||||
var hide_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 7000);
|
||||
}
|
||||
else {
|
||||
//-- reset form
|
||||
$(form).trigger('reset');
|
||||
$(form).find('.filled').each(function (index, element) {
|
||||
$(this).removeClass('filled');
|
||||
});
|
||||
|
||||
//-- hide loading
|
||||
var wait_loading = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1000);
|
||||
|
||||
//-- show notif error
|
||||
var show_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').find('label').remove();
|
||||
$(form).find('.form-notif').append('<label class="notif-error">Error</label>');
|
||||
$(form).find('.form-notif').addClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 1500);
|
||||
|
||||
//-- wait 5 seconds and then hide the notification
|
||||
var hide_notif = setTimeout(function () {
|
||||
$(form).find('.form-notif').removeClass('is-visible');
|
||||
|
||||
clearTimeout(this);
|
||||
}, 7000);
|
||||
}
|
||||
});
|
||||
|
||||
return false;
|
||||
}
|
||||
});
|
||||
//-- end validate and submit contact us form
|
||||
|
||||
//Menu script
|
||||
$(document).delegate('.open', 'click', function (event) {
|
||||
$(this).addClass('oppenned');
|
||||
event.stopPropagation();
|
||||
})
|
||||
$(document).delegate('body', 'click', function (event) {
|
||||
$('.open').removeClass('oppenned');
|
||||
})
|
||||
$(document).delegate('.oppenned', 'click', function (event) {
|
||||
$('.open').removeClass('oppenned');
|
||||
event.stopPropagation();
|
||||
});
|
||||
});
|
||||
//-- end document.ready function
|
||||
})(jQuery);
|
||||
@@ -1,5 +0,0 @@
|
||||
/*! Respond.js v1.4.2: min/max-width media query polyfill * Copyright 2013 Scott Jehl
|
||||
* Licensed under https://github.com/scottjehl/Respond/blob/master/LICENSE-MIT
|
||||
* */
|
||||
|
||||
!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){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}}}(a.document)}(this),function(a){"use strict";function b(){u(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();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))};if(c.ajax=f,c.queue=d,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\([\s]*min\-width\s*:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/,maxw:/\([\s]*max\-width\s*:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var g,h,i,j=a.document,k=j.documentElement,l=[],m=[],n=[],o={},p=30,q=j.getElementsByTagName("head")[0]||k,r=j.getElementsByTagName("base")[0],s=q.getElementsByTagName("link"),t=function(){var a,b=j.createElement("div"),c=j.body,d=k.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=j.createElement("body"),c.style.background="none"),k.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&k.insertBefore(c,k.firstChild),a=b.offsetWidth,f?k.removeChild(c):c.removeChild(b),k.style.fontSize=d,e&&(c.style.fontSize=e),a=i=parseFloat(a)},u=function(b){var c="clientWidth",d=k[c],e="CSS1Compat"===j.compatMode&&d||j.body[c]||d,f={},o=s[s.length-1],r=(new Date).getTime();if(b&&g&&p>r-g)return a.clearTimeout(h),h=a.setTimeout(u,p),void 0;g=r;for(var v in l)if(l.hasOwnProperty(v)){var w=l[v],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?i||t():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?i||t():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(m[w.rules]))}for(var C in n)n.hasOwnProperty(C)&&n[C]&&n[C].parentNode===q&&q.removeChild(n[C]);n.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=j.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,q.insertBefore(E,o.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(j.createTextNode(F)),n.push(E)}},v=function(a,b,d){var e=a.replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var g=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},h=!f&&d;b.length&&(b+="/"),h&&(f=1);for(var i=0;f>i;i++){var j,k,n,o;h?(j=d,m.push(g(a))):(j=e[i].match(c.regex.findStyles)&&RegExp.$1,m.push(RegExp.$2&&g(RegExp.$2))),n=j.split(","),o=n.length;for(var p=0;o>p;p++)k=n[p],l.push({media:k.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:m.length-1,hasquery:k.indexOf("(")>-1,minw:k.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:k.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},w=function(){if(d.length){var b=d.shift();f(b.href,function(c){v(c,b.href,b.media),o[b.href]=!0,a.setTimeout(function(){w()},0)})}},x=function(){for(var b=0;b<s.length;b++){var c=s[b],e=c.href,f=c.media,g=c.rel&&"stylesheet"===c.rel.toLowerCase();e&&g&&!o[e]&&(c.styleSheet&&c.styleSheet.rawCssText?(v(c.styleSheet.rawCssText,e,f),o[e]=!0):(!/^([a-zA-Z:]*\/\/)/.test(e)&&!r||e.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&("//"===e.substring(0,2)&&(e=a.location.protocol+e),d.push({href:e,media:f})))}w()};x(),c.update=x,c.getEmValue=t,a.addEventListener?a.addEventListener("resize",b,!1):a.attachEvent&&a.attachEvent("onresize",b)}}(this);
|
||||
@@ -1,739 +0,0 @@
|
||||
/*! Verify-v0.1.0 MIT License by 大熊*/
|
||||
|
||||
|
||||
;(function($, window, document,undefined) {
|
||||
|
||||
//定义Code的构造函数
|
||||
var Code = function(ele, opt) {
|
||||
this.$element = ele,
|
||||
this.defaults = {
|
||||
type : 1,
|
||||
figure : 100, //位数,仅在type=2时生效
|
||||
arith : 0, //算法,支持加减乘,0为随机,仅在type=2时生效
|
||||
width : '200px',
|
||||
height : '60px',
|
||||
fontSize : '30px',
|
||||
codeLength : 6,
|
||||
btnId : 'check-btn',
|
||||
ready : function(){},
|
||||
success : function(){},
|
||||
error : function(){}
|
||||
},
|
||||
this.options = $.extend({}, this.defaults, opt)
|
||||
};
|
||||
|
||||
var _code_chars = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
|
||||
var _code_color1 = ['#fffff0', '#f0ffff', '#f0fff0', '#fff0f0'];
|
||||
var _code_color2 = ['#FF0033', '#006699', '#993366', '#FF9900', '#66CC66', '#FF33CC'];
|
||||
|
||||
//定义Code的方法
|
||||
Code.prototype = {
|
||||
init : function() {
|
||||
|
||||
var _this = this;
|
||||
|
||||
this.loadDom();
|
||||
this.setCode();
|
||||
|
||||
this.options.ready();
|
||||
|
||||
this.$element[0].onselectstart = document.body.ondrag = function(){
|
||||
return false;
|
||||
};
|
||||
|
||||
//点击验证码
|
||||
this.$element.find('.verify-code, .verify-change-code').on('click', function() {
|
||||
_this.setCode();
|
||||
});
|
||||
|
||||
//确定的点击事件
|
||||
this.htmlDoms.code_btn.on('click', function() {
|
||||
_this.checkCode();
|
||||
})
|
||||
|
||||
},
|
||||
|
||||
//加载页面
|
||||
loadDom : function() {
|
||||
var panelHtml = '<div class="cerify-code-panel"><div class="verify-code"></div><div class="verify-code-area"><div class="verify-input-area"><input type="text" class="varify-input-code" /></div><div class="verify-change-area"><a class="verify-change-code">换一张</a></div></div></div>';
|
||||
this.$element.append(panelHtml);
|
||||
|
||||
this.htmlDoms = {
|
||||
code_btn : $('#'+this.options.btnId),
|
||||
code : this.$element.find('.verify-code'),
|
||||
code_area : this.$element.find('.verify-code-area'),
|
||||
code_input : this.$element.find('.varify-input-code'),
|
||||
};
|
||||
|
||||
this.htmlDoms.code.css({'width':this.options.width, 'height':this.options.height,'line-height':this.options.height, 'font-size':this.options.fontSize});
|
||||
this.htmlDoms.code_area.css({'width':this.options.width});
|
||||
},
|
||||
|
||||
|
||||
//设置验证码
|
||||
setCode : function() {
|
||||
|
||||
var color1Num = Math.floor(Math.random() * 3);
|
||||
var color2Num = Math.floor(Math.random() * 5);
|
||||
|
||||
this.htmlDoms.code.css({'background-color': _code_color1[color1Num], 'color': _code_color2[color2Num]});
|
||||
this.htmlDoms.code_input.val('');
|
||||
|
||||
var code = '';
|
||||
this.code_chose = '';
|
||||
|
||||
if(this.options.type == 1) { //普通验证码
|
||||
for(var i = 0; i < this.options.codeLength; i++) {
|
||||
var charNum = Math.floor(Math.random() * 52);
|
||||
var tmpStyle = (charNum%2 ==0)? "font-style:italic;margin-right: 10px;":"font-weight:bolder;";
|
||||
tmpStyle += (Math.floor(Math.random() * 2) == 1)? "font-weight:bolder;":"";
|
||||
|
||||
this.code_chose += _code_chars[charNum];
|
||||
code += '<font style="'+tmpStyle+'">'+_code_chars[charNum]+'</font>';
|
||||
}
|
||||
}else { //算法验证码
|
||||
|
||||
var num1 = Math.floor(Math.random() * this.options.figure);
|
||||
var num2 = Math.floor(Math.random() * this.options.figure);
|
||||
|
||||
if(this.options.arith == 0) {
|
||||
var tmparith = Math.floor(Math.random() * 3);
|
||||
}
|
||||
|
||||
switch(tmparith) {
|
||||
case 1 :
|
||||
this.code_chose = parseInt(num1) + parseInt(num2);
|
||||
code = num1 + ' + ' + num2 + ' = ?';
|
||||
break;
|
||||
case 2 :
|
||||
if(parseInt(num1) < parseInt(num2)) {
|
||||
var tmpnum = num1;
|
||||
num1 = num2;
|
||||
num2 = tmpnum;
|
||||
}
|
||||
this.code_chose = parseInt(num1) - parseInt(num2);
|
||||
code = num1 + ' - ' + num2 + ' = ?';
|
||||
break;
|
||||
default :
|
||||
this.code_chose = parseInt(num1) * parseInt(num2);
|
||||
code = num1 + ' × ' + num2 + ' = ?';
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.htmlDoms.code.html(code);
|
||||
|
||||
},
|
||||
|
||||
//比对验证码
|
||||
checkCode : function() {
|
||||
if(this.options.type == 1) { //普通验证码
|
||||
var own_input = this.htmlDoms.code_input.val().toUpperCase();
|
||||
this.code_chose = this.code_chose.toUpperCase();
|
||||
}else {
|
||||
var own_input = this.htmlDoms.code_input.val();
|
||||
}
|
||||
|
||||
if(own_input == this.code_chose) {
|
||||
this.options.success();
|
||||
}else {
|
||||
this.options.error();
|
||||
this.setCode();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
//定义Slide的构造函数
|
||||
var Slide = function(ele, opt) {
|
||||
this.$element = ele,
|
||||
this.defaults = {
|
||||
|
||||
type : 1,
|
||||
vOffset: 5,
|
||||
vSpace : 5,
|
||||
imgName : ['1.jpg', '2.jpg'],
|
||||
imgSize : {
|
||||
width: '400px',
|
||||
height: '200px',
|
||||
},
|
||||
blockSize : {
|
||||
width: '50px',
|
||||
height: '50px',
|
||||
},
|
||||
barSize : {
|
||||
width : '400px',
|
||||
height : '40px',
|
||||
},
|
||||
ready : function(){},
|
||||
success : function(){},
|
||||
error : function(){}
|
||||
|
||||
},
|
||||
this.options = $.extend({}, this.defaults, opt)
|
||||
};
|
||||
|
||||
|
||||
//定义Slide的方法
|
||||
Slide.prototype = {
|
||||
|
||||
init: function() {
|
||||
var _this = this;
|
||||
|
||||
//加载页面
|
||||
this.loadDom();
|
||||
this.options.ready();
|
||||
|
||||
this.$element[0].onselectstart = document.body.ondrag = function(){
|
||||
return false;
|
||||
};
|
||||
|
||||
//按下
|
||||
this.htmlDoms.move_block.on('touchstart', function(e) {
|
||||
_this.start(e);
|
||||
});
|
||||
|
||||
this.htmlDoms.move_block.on('mousedown', function(e) {
|
||||
_this.start(e);
|
||||
});
|
||||
|
||||
//拖动
|
||||
window.addEventListener("touchmove", function(e) {
|
||||
_this.move(e);
|
||||
});
|
||||
window.addEventListener("mousemove", function(e) {
|
||||
_this.move(e);
|
||||
});
|
||||
|
||||
//鼠标松开
|
||||
window.addEventListener("touchend", function() {
|
||||
_this.end();
|
||||
});
|
||||
window.addEventListener("mouseup", function() {
|
||||
_this.end();
|
||||
});
|
||||
|
||||
//刷新
|
||||
_this.$element.find('.verify-refresh').on('click', function() {
|
||||
_this.refresh();
|
||||
});
|
||||
},
|
||||
|
||||
//初始化加载
|
||||
loadDom : function() {
|
||||
this.img_rand = Math.floor(Math.random() * this.options.imgName.length); //随机的背景图片
|
||||
|
||||
var panelHtml = '';
|
||||
var tmpHtml = '';
|
||||
|
||||
if(this.options.type != 1) { //图片滑动
|
||||
panelHtml += '<div class="verify-img-panel"><div class="verify-refresh"><i class="iconfont icon-refresh"></i></div><div class="verify-gap"></div></div>';
|
||||
tmpHtml = '<div class="verify-sub-block"></div>';
|
||||
}
|
||||
|
||||
panelHtml += '<div class="verify-bar-area"><span class="verify-msg">向右滑动完成验证</span><div class="verify-left-bar"><span class="verify-msg"></span><div class="verify-move-block"><i class="verify-icon iconfont icon-right"></i>'+tmpHtml+'</div></div></div>';
|
||||
this.$element.append(panelHtml);
|
||||
|
||||
this.htmlDoms = {
|
||||
gap : this.$element.find('.verify-gap'),
|
||||
sub_block : this.$element.find('.verify-sub-block'),
|
||||
img_panel : this.$element.find('.verify-img-panel'),
|
||||
bar_area : this.$element.find('.verify-bar-area'),
|
||||
move_block : this.$element.find('.verify-move-block'),
|
||||
left_bar : this.$element.find('.verify-left-bar'),
|
||||
msg : this.$element.find('.verify-msg'),
|
||||
icon : this.$element.find('.verify-icon'),
|
||||
refresh :this.$element.find('.verify-refresh')
|
||||
};
|
||||
|
||||
this.status = false; //鼠标状态
|
||||
this.setSize = this.resetSize(this); //重新设置宽度高度
|
||||
|
||||
this.htmlDoms.gap.css({'width': this.options.blockSize.width, 'height': this.options.blockSize.height});
|
||||
this.htmlDoms.sub_block.css({'width': this.options.blockSize.width, 'height': this.options.blockSize.height});
|
||||
this.htmlDoms.img_panel.css({'width': this.setSize.img_width, 'height': this.setSize.img_height, 'background': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size' : this.setSize.img_width + ' '+ this.setSize.img_height});
|
||||
this.htmlDoms.bar_area.css({'width': this.setSize.bar_width, 'height': this.options.barSize.height, 'line-height':this.options.barSize.height});
|
||||
this.htmlDoms.move_block.css({'width': this.options.barSize.height, 'height': this.options.barSize.height});
|
||||
this.htmlDoms.left_bar.css({'width': this.options.barSize.height, 'height': this.options.barSize.height});
|
||||
|
||||
this.randSet();
|
||||
},
|
||||
|
||||
//鼠标按下
|
||||
start: function(e) {
|
||||
this.htmlDoms.msg.text('');
|
||||
this.htmlDoms.move_block.css('background-color', '#337ab7');
|
||||
this.htmlDoms.left_bar.css('border-color', '#337AB7');
|
||||
this.htmlDoms.icon.css('color', '#fff');
|
||||
e.stopPropagation();
|
||||
this.status = true;
|
||||
|
||||
},
|
||||
|
||||
//鼠标移动
|
||||
move: function(e) {
|
||||
if(this.status) {
|
||||
if(!e.touches) { //兼容移动端
|
||||
var x = e.clientX;
|
||||
}else { //兼容PC端
|
||||
var x = e.touches[0].pageX;
|
||||
}
|
||||
var bar_area_left = Slide.prototype.getLeft(this.htmlDoms.bar_area[0]);
|
||||
var move_block_left = x - bar_area_left; //小方块相对于父元素的left值
|
||||
|
||||
|
||||
if(this.options.type != 1) { //图片滑动
|
||||
if(move_block_left >= this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.blockSize.width)/2) - 2) {
|
||||
move_block_left = this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.blockSize.width)/2) - 2;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}else { //普通滑动
|
||||
if(move_block_left >= this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.barSize.height)/2) + 3) {
|
||||
this.$element.find('.verify-msg:eq(1)').text('松开验证');
|
||||
move_block_left = this.htmlDoms.bar_area[0].offsetWidth - parseInt(parseInt(this.options.barSize.height)/2) + 3;
|
||||
}else {
|
||||
this.$element.find('.verify-msg:eq(1)').text('');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if(move_block_left <= 0) {
|
||||
move_block_left = parseInt(parseInt(this.options.blockSize.width)/2);
|
||||
}
|
||||
|
||||
//拖动后小方块的left值
|
||||
this.htmlDoms.move_block.css('left', move_block_left-parseInt(parseInt(this.options.blockSize.width)/2) + "px");
|
||||
this.htmlDoms.left_bar.css('width', move_block_left-parseInt(parseInt(this.options.blockSize.width)/2) + "px");
|
||||
}
|
||||
},
|
||||
|
||||
//鼠标松开
|
||||
end: function() {
|
||||
|
||||
var _this = this;
|
||||
|
||||
//判断是否重合
|
||||
if(this.status) {
|
||||
|
||||
if(this.options.type != 1) { //图片滑动
|
||||
|
||||
var vOffset = parseInt(this.options.vOffset);
|
||||
if(parseInt(this.htmlDoms.gap.css('left')) >= (parseInt(this.htmlDoms.move_block.css('left')) - vOffset) && parseInt(this.htmlDoms.gap.css('left')) <= (parseInt(this.htmlDoms.move_block.css('left')) + vOffset)) {
|
||||
this.htmlDoms.move_block.css('background-color', '#5cb85c');
|
||||
this.htmlDoms.left_bar.css({'border-color': '#5cb85c', 'background-color': '#fff'});
|
||||
this.htmlDoms.icon.css('color', '#fff');
|
||||
this.htmlDoms.icon.removeClass('icon-right');
|
||||
this.htmlDoms.icon.addClass('icon-check');
|
||||
this.htmlDoms.refresh.hide();
|
||||
this.htmlDoms.move_block.unbind('mousedown touchstart');
|
||||
this.options.success();
|
||||
}else{
|
||||
this.htmlDoms.move_block.css('background-color', '#d9534f');
|
||||
this.htmlDoms.left_bar.css('border-color', '#d9534f');
|
||||
this.htmlDoms.icon.css('color', '#fff');
|
||||
this.htmlDoms.icon.removeClass('icon-right');
|
||||
this.htmlDoms.icon.addClass('icon-close');
|
||||
|
||||
setTimeout(function () {
|
||||
_this.htmlDoms.move_block.animate({'left':'0px'}, 'fast');
|
||||
_this.htmlDoms.left_bar.animate({'width': '40px'}, 'fast');
|
||||
_this.htmlDoms.left_bar.css({'border-color': '#ddd'});
|
||||
|
||||
_this.htmlDoms.move_block.css('background-color', '#fff');
|
||||
_this.htmlDoms.icon.css('color', '#000');
|
||||
_this.htmlDoms.icon.removeClass('icon-close');
|
||||
_this.htmlDoms.icon.addClass('icon-right');
|
||||
_this.$element.find('.verify-msg:eq(0)').text('向右滑动完成验证');
|
||||
|
||||
}, 400);
|
||||
|
||||
this.options.error();
|
||||
}
|
||||
|
||||
}else { //普通滑动
|
||||
|
||||
if(parseInt(this.htmlDoms.move_block.css('left')) >= (parseInt(this.setSize.bar_width) - parseInt(this.options.barSize.height) - parseInt(this.options.vOffset))) {
|
||||
this.htmlDoms.move_block.css('background-color', '#5cb85c');
|
||||
this.htmlDoms.left_bar.css({'color': '#4cae4c', 'border-color': '#5cb85c', 'background-color': '#fff' });
|
||||
this.htmlDoms.icon.css('color', '#fff');
|
||||
this.htmlDoms.icon.removeClass('icon-right');
|
||||
this.htmlDoms.icon.addClass('icon-check');
|
||||
this.htmlDoms.refresh.hide();
|
||||
this.htmlDoms.move_block.unbind('mousedown');
|
||||
this.htmlDoms.move_block.unbind('touchstart');
|
||||
this.$element.find('.verify-msg:eq(1)').text('验证成功');
|
||||
this.options.success();
|
||||
}else {
|
||||
|
||||
this.htmlDoms.move_block.css('background-color', '#d9534f');
|
||||
this.htmlDoms.left_bar.css('border-color', '#d9534f');
|
||||
this.htmlDoms.icon.css('color', '#fff');
|
||||
this.htmlDoms.icon.removeClass('icon-right');
|
||||
this.htmlDoms.icon.addClass('icon-close');
|
||||
|
||||
setTimeout(function () {
|
||||
_this.htmlDoms.move_block.animate({'left':'0px'}, 'fast');
|
||||
_this.htmlDoms.left_bar.animate({'width': '40px'}, 'fast');
|
||||
_this.htmlDoms.left_bar.css({'border-color': '#ddd'});
|
||||
|
||||
_this.htmlDoms.move_block.css('background-color', '#fff');
|
||||
_this.htmlDoms.icon.css('color', '#000');
|
||||
_this.htmlDoms.icon.removeClass('icon-close');
|
||||
_this.htmlDoms.icon.addClass('icon-right');
|
||||
_this.$element.find('.verify-msg:eq(0)').text('向右滑动解锁');
|
||||
|
||||
}, 400);
|
||||
|
||||
this.options.error();
|
||||
}
|
||||
}
|
||||
|
||||
this.status = false;
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
resetSize : function(obj) {
|
||||
var img_width,img_height,bar_width,bar_height; //图片的宽度、高度,移动条的宽度、高度
|
||||
var parentWidth = obj.$element.parent().width() || $(window).width();
|
||||
var parentHeight = obj.$element.parent().height() || $(window).height();
|
||||
|
||||
if(obj.options.imgSize.width.indexOf('%')!= -1){
|
||||
img_width = parseInt(obj.options.imgSize.width)/100 * parentWidth + 'px';
|
||||
}else {
|
||||
img_width = obj.options.imgSize.width;
|
||||
}
|
||||
|
||||
if(obj.options.imgSize.height.indexOf('%')!= -1){
|
||||
img_height = parseInt(obj.options.imgSize.height)/100 * parentHeight + 'px';
|
||||
}else {
|
||||
img_height = obj.options.imgSize.height;
|
||||
}
|
||||
|
||||
if(obj.options.barSize.width.indexOf('%')!= -1){
|
||||
bar_width = parseInt(obj.options.barSize.width)/100 * parentWidth + 'px';
|
||||
}else {
|
||||
bar_width = obj.options.barSize.width;
|
||||
}
|
||||
|
||||
if(obj.options.barSize.height.indexOf('%')!= -1){
|
||||
bar_height = parseInt(obj.options.barSize.height)/100 * parentHeight + 'px';
|
||||
}else {
|
||||
bar_height = obj.options.barSize.height;
|
||||
}
|
||||
|
||||
return {img_width : img_width, img_height : img_height, bar_width : bar_width, bar_height : bar_height};
|
||||
},
|
||||
|
||||
//随机出生点位
|
||||
randSet: function() {
|
||||
var rand1 = Math.floor(Math.random()*9+1);
|
||||
var rand2 = Math.floor(Math.random()*9+1);
|
||||
var top = rand1 * parseInt(this.setSize.img_height)/15 + parseInt(this.setSize.img_height) * 0.1;
|
||||
var left = rand2 * parseInt(this.setSize.img_width)/15 + parseInt(this.setSize.img_width) * 0.1;
|
||||
|
||||
this.$element.find('.verify-img-panel').css('margin-bottom', this.options.vSpace + 'px');
|
||||
this.$element.find('.verify-gap').css({'top': top, 'left': left});
|
||||
this.$element.find('.verify-sub-block').css({'top':'-'+(parseInt(this.setSize.img_height)- top + this.options.vSpace + 2)+'px', 'background-image': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size': this.setSize.img_width + ' '+ this.setSize.img_height,'background-position-y': '-'+top+ 'px', 'background-position-x': '-'+left+'px'});
|
||||
},
|
||||
|
||||
//刷新
|
||||
refresh: function() {
|
||||
this.randSet();
|
||||
this.img_rand = Math.floor(Math.random() * this.options.imgName.length); //随机的背景图片
|
||||
this.$element.find('.verify-img-panel').css({'background': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size': this.setSize.img_width + ' '+ this.setSize.img_height});
|
||||
this.$element.find('.verify-sub-block').css({'background-image': 'url(images/'+this.options.imgName[this.img_rand]+')', 'background-size': this.setSize.img_width + ' '+ this.setSize.img_height});
|
||||
},
|
||||
|
||||
//获取left值
|
||||
getLeft: function(node) {
|
||||
var left = $(node).offset().left;
|
||||
// var nowPos = node.offsetParent;
|
||||
//
|
||||
// while(nowPos != null) {
|
||||
// left += $(nowPos).offset().left;
|
||||
// nowPos = nowPos.offsetParent;
|
||||
// }
|
||||
return left;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
//定义Points的构造函数
|
||||
var Points = function(ele, opt) {
|
||||
this.$element = ele,
|
||||
this.defaults = {
|
||||
defaultNum : 4, //默认的文字数量
|
||||
checkNum : 3, //校对的文字数量
|
||||
vSpace : 5, //间隔
|
||||
imgName : ['1.jpg', '2.jpg'],
|
||||
imgSize : {
|
||||
width: '400px',
|
||||
height: '200px',
|
||||
},
|
||||
barSize : {
|
||||
width : '400px',
|
||||
height : '40px',
|
||||
},
|
||||
ready : function(){},
|
||||
success : function(){},
|
||||
error : function(){}
|
||||
},
|
||||
this.options = $.extend({}, this.defaults, opt)
|
||||
};
|
||||
|
||||
//定义Points的方法
|
||||
Points.prototype = {
|
||||
init : function() {
|
||||
|
||||
var _this = this;
|
||||
|
||||
//加载页面
|
||||
_this.loadDom();
|
||||
|
||||
_this.refresh();
|
||||
_this.options.ready();
|
||||
|
||||
this.$element[0].onselectstart = document.body.ondrag = function(){
|
||||
return false;
|
||||
};
|
||||
|
||||
//点击事件比对
|
||||
_this.$element.find('.verify-img-panel canvas').on('click', function(e) {
|
||||
|
||||
_this.checkPosArr.push(_this.getMousePos(this, e));
|
||||
|
||||
if(_this.num == _this.options.checkNum) {
|
||||
|
||||
_this.num = _this.createPoint(_this.getMousePos(this, e));
|
||||
setTimeout(function () {
|
||||
var flag = _this.comparePos(_this.fontPos, _this.checkPosArr);
|
||||
|
||||
if(flag == false) { //验证失败
|
||||
|
||||
_this.options.error();
|
||||
_this.$element.find('.verify-bar-area').css({'color': '#d9534f', 'border-color': '#d9534f'});
|
||||
_this.$element.find('.verify-msg').text('验证失败');
|
||||
|
||||
setTimeout(function () {
|
||||
_this.$element.find('.verify-bar-area').css({'color': '#000','border-color': '#ddd'});
|
||||
_this.refresh();
|
||||
}, 400);
|
||||
|
||||
}else { //验证成功
|
||||
_this.$element.find('.verify-bar-area').css({'color': '#4cae4c', 'border-color': '#5cb85c'});
|
||||
_this.$element.find('.verify-msg').text('验证成功');
|
||||
_this.$element.find('.verify-refresh').hide();
|
||||
_this.$element.find('.verify-img-panel').unbind('click');
|
||||
_this.options.success();
|
||||
}
|
||||
}, 400);
|
||||
|
||||
}
|
||||
|
||||
if(_this.num < _this.options.checkNum) {
|
||||
_this.num = _this.createPoint(_this.getMousePos(this, e));
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
//刷新
|
||||
_this.$element.find('.verify-refresh').on('click', function() {
|
||||
_this.refresh();
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
|
||||
|
||||
//加载页面
|
||||
loadDom : function() {
|
||||
|
||||
this.fontPos = []; //选中的坐标信息
|
||||
this.checkPosArr = []; //用户点击的坐标
|
||||
this.num = 1; //点击的记数
|
||||
this.img_rand = Math.floor(Math.random() * this.options.imgName.length); //随机的背景图片
|
||||
|
||||
var panelHtml = '';
|
||||
var tmpHtml = '';
|
||||
|
||||
this.setSize = Slide.prototype.resetSize(this); //重新设置宽度高度
|
||||
|
||||
panelHtml += '<div class="verify-img-panel"><div class="verify-refresh" style="z-index:9999"><i class="iconfont icon-refresh"></i></div><canvas width="'+this.setSize.img_width+'" height="'+this.setSize.img_height+'"></canvas></div><div class="verify-bar-area"><span class="verify-msg"></span></div>';
|
||||
|
||||
this.$element.append(panelHtml);
|
||||
|
||||
|
||||
this.htmlDoms = {
|
||||
img_panel : this.$element.find('.verify-img-panel'),
|
||||
bar_area : this.$element.find('.verify-bar-area'),
|
||||
msg : this.$element.find('.verify-msg'),
|
||||
};
|
||||
|
||||
this.htmlDoms.img_panel.css({'width': this.setSize.img_width, 'height': this.setSize.img_height, 'background-size' : this.setSize.img_width + ' '+ this.setSize.img_height, 'margin-bottom': this.options.vSpace + 'px'});
|
||||
this.htmlDoms.bar_area.css({'width': this.options.barSize.width, 'height': this.options.barSize.height, 'line-height':this.options.barSize.height});
|
||||
|
||||
},
|
||||
|
||||
//绘制合成的图片
|
||||
drawImg : function(obj, img) {
|
||||
//准备canvas环境
|
||||
var canvas = this.$element.find('canvas')[0];
|
||||
//var canvas=document.getElementById("myCanvas");
|
||||
var ctx=canvas.getContext("2d");
|
||||
|
||||
// 绘制图片
|
||||
ctx.drawImage(img,0,0, parseInt(this.setSize.img_width), parseInt(this.setSize.img_height));
|
||||
|
||||
// 绘制水印
|
||||
var fontSizeArr = ['italic small-caps bold 20px microsoft yahei', 'small-caps normal 25px arial', '34px microsoft yahei'];
|
||||
var fontStr = '天地玄黄宇宙洪荒日月盈昃辰宿列张寒来暑往秋收冬藏闰余成岁律吕调阳云腾致雨露结为霜金生丽水玉出昆冈剑号巨阙珠称夜光果珍李柰菜重芥姜海咸河淡鳞潜羽翔龙师火帝鸟官人皇始制文字乃服衣裳推位让国有虞陶唐吊民伐罪周发殷汤坐朝问道垂拱平章爱育黎首臣伏戎羌遐迩体率宾归王'; //不重复的汉字
|
||||
|
||||
|
||||
var fontChars = [];
|
||||
|
||||
var avg = Math.floor(parseInt(this.setSize.img_width)/(parseInt(this.options.defaultNum)+1));
|
||||
var tmp_index = '';
|
||||
var color2Num = Math.floor(Math.random() * 5);
|
||||
|
||||
for(var i = 1; i <= this.options.defaultNum; i++) {
|
||||
|
||||
fontChars[i-1] = this.getChars(fontStr, fontChars);
|
||||
|
||||
tmp_index = Math.floor(Math.random()*3);
|
||||
ctx.font = fontSizeArr[tmp_index];
|
||||
ctx.fillStyle = _code_color2[color2Num];
|
||||
|
||||
if(Math.floor(Math.random() * 2) == 1) {
|
||||
var tmp_y = Math.floor(parseInt(this.setSize.img_height)/2) + tmp_index*20 + 20;
|
||||
}else {
|
||||
var tmp_y = Math.floor(parseInt(this.setSize.img_height)/2) - tmp_index*20;
|
||||
}
|
||||
|
||||
ctx.fillText(fontChars[i-1],avg * i, tmp_y);
|
||||
this.fontPos[i-1] = {'char': fontChars[i-1], 'x': avg * i, 'y': tmp_y};
|
||||
|
||||
}
|
||||
|
||||
for(var i = 0; i < (this.options.defaultNum-this.options.checkNum); i++) {
|
||||
this.shuffle(this.fontPos).pop();
|
||||
}
|
||||
|
||||
var msgStr = '';
|
||||
for(var i = 0; i < this.fontPos.length; i++) {
|
||||
msgStr += this.fontPos[i].char + ',';
|
||||
}
|
||||
|
||||
this.htmlDoms.msg.text('请顺序点击【' + msgStr.substring(0,msgStr.length-1) + '】');
|
||||
|
||||
return this.fontPos;
|
||||
},
|
||||
|
||||
//获取坐标
|
||||
getMousePos :function(obj, event) {
|
||||
var e = event || window.event;
|
||||
var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
|
||||
var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
|
||||
var x = e.clientX - ($(obj).offset().left - $(window).scrollLeft());
|
||||
var y = e.clientY - ($(obj).offset().top - $(window).scrollTop());
|
||||
|
||||
return {'x': x, 'y': y};
|
||||
},
|
||||
|
||||
//递归去重
|
||||
getChars : function(fontStr, fontChars) {
|
||||
|
||||
var tmp_rand = parseInt(Math.floor(Math.random() * fontStr.length));
|
||||
if(tmp_rand > 0) {
|
||||
tmp_rand = tmp_rand - 1;
|
||||
}
|
||||
|
||||
tmp_char = fontStr.charAt(tmp_rand);
|
||||
if($.inArray(tmp_char, fontChars) == -1) {
|
||||
return tmp_char;
|
||||
}else {
|
||||
return Points.prototype.getChars(fontStr, fontChars);
|
||||
}
|
||||
},
|
||||
|
||||
//洗牌数组
|
||||
shuffle : function(arr) {
|
||||
var m = arr.length, i;
|
||||
while (m) {
|
||||
i = (Math.random() * m--) >>> 0;
|
||||
[arr[m], arr[i]] = [arr[i], arr[m]]
|
||||
}
|
||||
return arr;
|
||||
},
|
||||
|
||||
//创建坐标点
|
||||
createPoint : function (pos) {
|
||||
this.htmlDoms.img_panel.append('<div class="point-area" style="background-color:#1abd6c;color:#fff;z-index:9999;width:30px;height:30px;text-align:center;line-height:30px;border-radius: 50%;position:absolute;top:'+parseInt(pos.y-10)+'px;left:'+parseInt(pos.x-10)+'px;">'+this.num+'</div>');
|
||||
return ++this.num;
|
||||
},
|
||||
|
||||
//比对坐标点
|
||||
comparePos : function (fontPos, checkPosArr) {
|
||||
|
||||
var flag = true;
|
||||
for(var i = 0; i < fontPos.length; i++) {
|
||||
if(!(parseInt(checkPosArr[i].x) + 40 > fontPos[i].x && parseInt(checkPosArr[i].x) - 40 < fontPos[i].x && parseInt(checkPosArr[i].y) + 40 > fontPos[i].y && parseInt(checkPosArr[i].y) - 40 < fontPos[i].y)) {
|
||||
flag = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return flag;
|
||||
},
|
||||
|
||||
//刷新
|
||||
refresh: function() {
|
||||
var _this = this;
|
||||
this.$element.find('.point-area').remove();
|
||||
this.fontPos = [];
|
||||
this.checkPosArr = [];
|
||||
this.num = 1;
|
||||
|
||||
this.img_rand = Math.floor(Math.random() * this.options.imgName.length); //随机的背景图片
|
||||
var img = new Image();
|
||||
img.src = 'images/'+this.options.imgName[this.img_rand];
|
||||
|
||||
|
||||
// 加载完成开始绘制
|
||||
$(img).on('load', function(e) {
|
||||
this.fontPos = _this.drawImg(_this, this);
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
};
|
||||
|
||||
//在插件中使用codeVerify对象
|
||||
$.fn.codeVerify = function(options, callbacks) {
|
||||
var code = new Code(this, options);
|
||||
code.init();
|
||||
};
|
||||
|
||||
//在插件中使用slideVerify对象
|
||||
$.fn.slideVerify = function(options, callbacks) {
|
||||
var slide = new Slide(this, options);
|
||||
slide.init();
|
||||
};
|
||||
|
||||
//在插件中使用clickVerify对象
|
||||
$.fn.pointsVerify = function(options, callbacks) {
|
||||
var points = new Points(this, options);
|
||||
points.init();
|
||||
};
|
||||
|
||||
})(jQuery, window, document);
|
||||
|
||||
function Randoms() {
|
||||
var myDate = new Date(); //实例一个时间对象;
|
||||
var tmp = Number(myDate.getMinutes()+''+myDate.getSeconds());
|
||||
retuen (tmp-500+1+2+3-4);
|
||||
}
|
||||
@@ -1,599 +0,0 @@
|
||||
/* ----- 头部样式 ----- */
|
||||
|
||||
/* 背景颜色、高度、底部阴影线 */
|
||||
.layui-layout-admin .layui-header {
|
||||
background-color: #fff;
|
||||
height: 50px;
|
||||
box-shadow: 0 1px 0 0 rgba(0, 0, 0, .05);
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-nav .layui-this:after,
|
||||
.layui-layout-admin .layui-header .layui-nav-bar {
|
||||
height: 2px;
|
||||
background-color: #03152a;
|
||||
top: 0 !important;
|
||||
}
|
||||
|
||||
/* 按钮颜色、间距、悬浮小手 */
|
||||
.layui-layout-admin .layui-header .layui-nav-item a {
|
||||
color: #333333;
|
||||
padding: 0 15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* 按钮悬浮时的颜色 */
|
||||
.layui-layout-admin .layui-header .layui-nav-item a:hover {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
/* 顶部导航 logo 样式 */
|
||||
.layui-layout-admin .layui-header .layui-logo {
|
||||
width: 200px;
|
||||
background-color: #324157;
|
||||
color: #f2f2f2;
|
||||
font-size: 18px;
|
||||
font-family: Myriad Pro, Helvetica Neue, Arial, Helvetica, sans-serif;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
line-height: 50px;
|
||||
transition: all .3s;
|
||||
white-space: nowrap;
|
||||
box-shadow: 1px 0 2px 0 rgba(0, 0, 0, .05);
|
||||
}
|
||||
|
||||
/* 头部水平居中 */
|
||||
.layui-layout-admin .layui-header .layui-nav .layui-nav-item {
|
||||
line-height: 50px;
|
||||
vertical-align: unset;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-nav-item .layui-icon {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-logo img {
|
||||
height: 35px;
|
||||
}
|
||||
|
||||
/* 面包屑样式 */
|
||||
.layui-layout-admin .layui-header .layui-nav .layui-breadcrumb {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.layui-nav-child {
|
||||
top: 55px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-nav {
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
/* ----- 头部样式 ----- */
|
||||
|
||||
|
||||
/* ----- tab 样式 ----- */
|
||||
|
||||
/* tab 底色 */
|
||||
.layui-layout-admin .layui-tab .layui-tab-title li.layui-this,
|
||||
.layui-layout-admin .layui-tab .layui-tab-title li:hover {
|
||||
background-color: #f6f6f6;
|
||||
}
|
||||
|
||||
/* tab 下划线 */
|
||||
.layui-tab-title {
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
|
||||
/* 导航最小宽度 */
|
||||
.layui-layout-admin .layui-tab .layui-tab-title li {
|
||||
min-width: 0;
|
||||
line-height: 40px;
|
||||
max-width: 160px;
|
||||
text-overflow: ellipsis;
|
||||
padding-right: 30px;
|
||||
overflow: hidden;
|
||||
border-right: 1px solid #f6f6f6;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* 关闭按钮样式 */
|
||||
.layui-layout-admin .layui-tab > .layui-tab-title li .layui-tab-close {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
border-radius: 50%;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 8px;
|
||||
}
|
||||
|
||||
/* tab 顶部颜色 */
|
||||
.layui-layout-admin .layui-tab-title li.layui-this:after {
|
||||
width: 100%;
|
||||
border: none;
|
||||
height: 2px;
|
||||
background-color: #292B34;
|
||||
}
|
||||
|
||||
/* tab 顶部切换动画 */
|
||||
.layui-layout-admin .layui-tab-title li:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 0;
|
||||
height: 2px;
|
||||
border-radius: 0;
|
||||
background-color: #292B34;
|
||||
transition: all .3s;
|
||||
transition-property: all;
|
||||
transition-duration: 0.3s;
|
||||
transition-timing-function: ease;
|
||||
transition-delay: 0s;
|
||||
-webkit-transition: all .3s;
|
||||
}
|
||||
|
||||
/* 隐藏第一个 tab 的关闭按钮 */
|
||||
.layui-layout-admin .layui-tab > .layui-tab-title li:first-child .layui-tab-close {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 标签卡第一个的标签没有关闭按钮, 所以距离右侧的宽度 15px */
|
||||
.layui-layout-admin .layui-tab > .layui-tab-title li:first-child {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
/* tab 页距离顶部距离为 0 */
|
||||
.layui-layout-admin .layui-tab {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* 距离顶部的距离和左侧导航的距离 */
|
||||
.layui-layout-admin .layui-body {
|
||||
left: 200px;
|
||||
top: 50px;
|
||||
}
|
||||
|
||||
/* tab 行的高度, 背景色等 */
|
||||
.layui-pagetabs {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
padding: 0 80px 0 0;
|
||||
background-color: #fff;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
/* ----- tab 样式 ----- */
|
||||
|
||||
|
||||
/* ----- tab 左右按钮样式 ----- */
|
||||
|
||||
.layui-layout-admin .layui-body .admin-tabs-control {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
transition: all .3s;
|
||||
border-left: 1px solid #eee;
|
||||
z-index: 1000;
|
||||
background-color: white
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-body .admin-tabs-control:hover {
|
||||
background-color: #eee
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-body .layui-icon-shrink-right {
|
||||
left: 0;
|
||||
border-left: none;
|
||||
border-right: 1px solid #eee
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-body .layui-icon-refresh-3 {
|
||||
right: 0
|
||||
}
|
||||
|
||||
/* ----- tab 左右按钮样式 ----- */
|
||||
|
||||
|
||||
/* ----- 导航样式 ----- */
|
||||
|
||||
|
||||
/* 导航背景颜色 */
|
||||
.layui-layout-admin .layui-side {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
width: 200px;
|
||||
background-color: #324157;
|
||||
transition: all .3s;
|
||||
-webkit-transition: all .3s;
|
||||
box-shadow: 1px 0 2px 0 rgba(0, 0, 0, .05);
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav {
|
||||
width: 200px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item .layui-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 20px;
|
||||
margin-top: -25px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item a {
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
padding-left: 30px;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
/* 一级导航悬浮字体颜色和背景颜色 */
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item > a:hover {
|
||||
color: #BFCBD9;
|
||||
background: #263445;
|
||||
}
|
||||
|
||||
/* 一级导航被选中时背景颜色和字体颜色 */
|
||||
.layui-nav-tree .layui-this,
|
||||
.layui-nav-tree .layui-this > a,
|
||||
.layui-nav-tree .layui-this > a:hover {
|
||||
background-color: #324157;
|
||||
color: rgb(64, 158, 255)
|
||||
}
|
||||
|
||||
/* 二级导航基础颜色 */
|
||||
.layui-nav-itemed > .layui-nav-child {
|
||||
display: block;
|
||||
padding: 0;
|
||||
background-color: #1f2d3d !important;
|
||||
}
|
||||
|
||||
/* 二级导航悬浮字体背景颜色 */
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item dl dd > a:hover {
|
||||
background-color: #01101f;
|
||||
}
|
||||
|
||||
/* 二级导航被选中时背景颜色和字体颜色 */
|
||||
.layui-nav-tree .layui-nav-child dd.layui-this a,
|
||||
.layui-nav-tree dd.layui-this {
|
||||
background-color: #1f2d3d !important;
|
||||
color: rgb(64, 158, 255)
|
||||
}
|
||||
|
||||
/* this 导航选中时, 颜色不变 */
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item.layui-this > a:hover {
|
||||
color: rgb(64, 158, 255)
|
||||
}
|
||||
|
||||
|
||||
/* 去除悬浮时左侧的绿条 */
|
||||
.layui-nav-tree .layui-nav-bar {
|
||||
width: 0;
|
||||
}
|
||||
|
||||
/* 导航菜单展开时颜色 */
|
||||
.layui-nav-itemed > a {
|
||||
color: #BFCBD9 !important;
|
||||
}
|
||||
|
||||
.layui-nav-tree .layui-nav-child, .layui-nav-tree .layui-nav-child a:hover {
|
||||
color: #BFCBD9;
|
||||
background: #001528 0 0;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-more {
|
||||
right: 15px
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item .layui-nav-child a {
|
||||
padding-left: 70px;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item .layui-nav-child .layui-nav-child a {
|
||||
padding-left: 70px
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item .layui-nav-child .layui-nav-child .layui-nav-child a {
|
||||
padding-left: 90px
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item .layui-nav-child .layui-nav-child .layui-nav-child .layui-nav-child a {
|
||||
padding-left: 110px
|
||||
}
|
||||
|
||||
/* 一级目录额外的高度 */
|
||||
.layui-layout-admin .layui-side .layui-nav .layui-nav-item > a {
|
||||
padding-top: 3px;
|
||||
padding-bottom: 3px;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
/* ----- 导航样式 ----- */
|
||||
|
||||
|
||||
/* ----- 导航收起样式 ----- */
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-logo {
|
||||
width: 60px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-logo cite {
|
||||
display: none
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-layout-left {
|
||||
left: 60px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side {
|
||||
width: 60px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav {
|
||||
width: 60px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side-scroll {
|
||||
width: 80px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item > a > cite {
|
||||
display: none
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item > a .layui-nav-more {
|
||||
display: none
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item > a {
|
||||
overflow: visible
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-itemed .layui-nav-child {
|
||||
display: none
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-body {
|
||||
left: 60px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-footer {
|
||||
left: 60px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav li.layui-nav-itemed > a {
|
||||
background: rgba(0, 0, 0, .3)
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-icon-shrink-right:before {
|
||||
content: "\e66b"
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item.admin-nav-hover > .layui-nav-child {
|
||||
display: inline-block;
|
||||
position: fixed;
|
||||
top: 105px;
|
||||
left: 65px;
|
||||
background: #24262f !important;
|
||||
min-width: 200px;
|
||||
z-index: 1001
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item.admin-nav-hover .layui-nav-itemed > .layui-nav-child {
|
||||
display: block
|
||||
}
|
||||
|
||||
/* ----- 导航收起样式 ----- */
|
||||
|
||||
|
||||
/* ----- 导航小屏幕样式 -----*/
|
||||
|
||||
@media screen and (max-width: 750px) {
|
||||
.layui-layout-admin .layui-side {
|
||||
position: fixed;
|
||||
left: -260px;
|
||||
z-index: 10000
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-body {
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-footer {
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-logo {
|
||||
left: -260px
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-layout-left {
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header .layui-icon-shrink-right:before {
|
||||
content: "\e66b"
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-logo {
|
||||
width: 220px;
|
||||
left: 0;
|
||||
z-index: 10001
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header {
|
||||
z-index: auto
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-logo cite {
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-layout-left {
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side {
|
||||
width: 220px;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav {
|
||||
width: 220px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side-scroll {
|
||||
width: 240px
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item > a > cite {
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item > a .layui-nav-more {
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item > a {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav li.layui-nav-itemed > a {
|
||||
background: transparent
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav li.layui-nav-item > a:hover {
|
||||
background: rgba(255, 255, 255, .03)
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-itemed > .layui-nav-child {
|
||||
display: block
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-body {
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-footer {
|
||||
left: 0
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .site-mobile-shade {
|
||||
content: '';
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
z-index: 9999;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-itemed > a {
|
||||
background: transparent
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-header .layui-icon-shrink-right:before {
|
||||
content: "\e668"
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-item.admin-nav-hover > .layui-nav-child {
|
||||
display: none;
|
||||
position: static;
|
||||
background-color: rgba(0, 0, 0, .3) !important;
|
||||
min-width: 100%
|
||||
}
|
||||
|
||||
.layui-layout-admin.admin-nav-mini .layui-side .layui-nav .layui-nav-itemed.admin-nav-hover > .layui-nav-child {
|
||||
display: block
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-nav .layui-breadcrumb span,
|
||||
.layui-layout-admin .layui-nav .layui-breadcrumb a:not(:last-child) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* ----- 导航小屏幕样式 ----- */
|
||||
|
||||
|
||||
/* ----- 底部样式 ----- */
|
||||
|
||||
.layui-layout-admin .layui-footer {
|
||||
left: 200px;
|
||||
background: #fff;
|
||||
transition: all .3s;
|
||||
color: #666;
|
||||
border-top: 1px solid #eee;
|
||||
height: 43px;
|
||||
}
|
||||
|
||||
/* ----- 底部样式 ----- */
|
||||
|
||||
|
||||
/* ----- iframe 样式 ----- */
|
||||
|
||||
.layui-iframe {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: calc(100% - 40px) !important;
|
||||
left: 0;
|
||||
top: 40px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* ----- iframe 样式 ----- */
|
||||
|
||||
|
||||
/* ----- 右键菜单样式 ----- */
|
||||
|
||||
.rightmenu {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
z-index: 9999;
|
||||
display: none;
|
||||
background-color: #fff;
|
||||
padding: 2px;
|
||||
color: #333;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.rightmenu li {
|
||||
text-align: center;
|
||||
display: block;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
margin: 8px 0 8px 0;
|
||||
|
||||
}
|
||||
|
||||
.rightmenu li:hover {
|
||||
background-color: #f2f2f2;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
|
||||
/* ----- 右键菜单样式 ----- */
|
||||
|
||||
html {
|
||||
font-style: normal;
|
||||
}
|
||||
@@ -1,57 +0,0 @@
|
||||
/* ----- 滚动条样式 ----- */
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-button:vertical {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner {
|
||||
background-color: #e2e2e2;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 8px;
|
||||
background-color: #a6a6a6;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:vertical:hover {
|
||||
background-color: #7f7f7f;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:vertical:active {
|
||||
background-color: rgba(0, 0, 0, .38);
|
||||
}
|
||||
|
||||
/* ----- 滚动条样式 ----- */
|
||||
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.page-loading {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.rubik-loader {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
background-image: url(/images/loading.gif);
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
@@ -1,80 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<link rel="stylesheet" href="/layui/css/layui.css">
|
||||
<link rel="stylesheet" href="/css/public.css">
|
||||
<title>222</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- 加载动画 -->
|
||||
<div class="page-loading">
|
||||
<div class="rubik-loader"></div>
|
||||
</div>
|
||||
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
<h1>Hello World</h1>
|
||||
</body>
|
||||
|
||||
<script src="/js/jquery.js"></script>
|
||||
<script src="/layui/layui.js"></script>
|
||||
<script src="/js/common.js"></script>
|
||||
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 7.5 KiB |
|
Before Width: | Height: | Size: 6.1 KiB |
|
Before Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 6.6 KiB |