::-webkit-input-placeholder { /* WebKit browsers */ color: #999; }
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #999; }
::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #999; }
:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #999; }
input:focus::-webkit-input-placeholder{ color:#999; }
Run code
Cut to clipboard
旋转样式
//竖屏时样式
@media all and (orientation:portrait){}
//横屏时样式
@media all and (orientation:landscape){}
###transition闪屏
```css
/设置内嵌的元素在 3D 空间如何呈现：保留3D /
-webkit-transform-style: preserve-3d;
/ 设置进行转换的元素的背面在面对用户时是否可见：隐藏 /
-webkit-backface-visibility:hidden;
function myfunc() {
console.log("myfunc....");
}
module.exports.myfunc = myfunc; //暴露接口，这里不暴露不能引用
Run code
Cut to clipboard
在文件域js内
var common = require("../../common.js");//去链接过来，光链接过来还不行
var app;
var common = require("../../common.js");
Page({
data:{
},
onLoad:function() {
app = getApp();
this.setData({version:app.globalData.appName});
common.myfunc(); //最后需要执行才能生效
}
})
var URl='http://123.23.169';
var getImageurl=function(imageurl){
return URl+imageurl;
}
// 要引用这个文件的函数或者变量，除了在要引用的的js文件中模块化之外（var utils=require('js地址')），
// 在被引用的的js中要通过 module.exports={a:a}作为面向对象的变量输出函数如下：
module.exports={
URl:URl,//要引用的函数 xx:xx
getImageurl:getImageurl
}
Run code
Cut to clipboard
要调用的js文件：
// 获得工具utils工具js里面函数,先模块化引用utils里面的js地址 reqiure('js地址')成一个面向对象
var utils=require('../../utils/app.js')
// console.log(utils) 可查看获得的函数
console.log(utils.getImageurl('iamgeaaddress.png'))
Run code
Cut to clipboard
#,广西南宁市,2018-01-02,16:35:07, 微信小程序 setdata自动设置
that.setData(res.data)
Run code
Cut to clipboard
#,广西南宁市,2018-01-02,16:36:00, JS 循环遍历JSON数据
var data=[{name:"a",age:12},{name:"b",age:11},{name:"c",age:13},{name:"d",age:14}];
for(var o in data){
alert(o);
alert(data[o]);
alert("text:"+data[o].name+" value:"+data[o].age );
}
猫
#533
#534
#535
个人常用的一些方法记录 /** * 返回错误 * * @param int $err_no * @param string $err_msg * @param array $data * @return array */ function returnError($err_no = 0, $err_msg = '', $data = []) { // 错误配置 $config = config('error'); // 错误信息 $error = [ 'err_no' => $err_no, 'err_msg' => empty($err_msg) ? $config[$err_no] : $err_msg, 'data' => $data ]; // 返回 return $error; } /** * 错误响应 * * @param int $err_no * @param string $err_msg * @param array $data * @param string $jsonp * @return \Illuminate\Http\Response */ function response($err_no = 0, $err_msg = '', $data = [], $jsonp = '') { // 错误配置 $config = config('error'); // 错误信息 $error = [ 'err_no' => $err_no, 'err_msg' => empty($err_msg) ? $config[$err_no] : $err_msg, 'data' => $data ]; // 格式化 $result = response()->json($error); empty($jsonp) || $result->setCallback($jsonp); // 返回 return $result; } /** * CURL * * @param string $url * @param string $type * [GET|POST] * @param array|string $data * @param array $header * @return bool|string */ function curlRequest($url = '', $type = 'GET', $data = '', $header = []) { // 参数校验 if (empty($url) || ! in_array(strtoupper($type), [ 'GET', 'POST', 'PUT', 'DELETE' ])) { return false; } // 初始化 $ch = curl_init(); if (! $ch) { return false; } // 请求参数 $data = is_array($data) ? http_build_query($data) : $data; // 请求方式 if (strtoupper($type) == 'POST') { curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_POSTFIELDS, $data); } if (strtoupper($type) == 'GET') { empty($data) || $url .= '?' . $data; } if (strtoupper($type) == 'PUT') { curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'PUT'); curl_setopt($ch, CURLOPT_POSTFIELDS, $data); } if (strtoupper($type) == 'DELETE') { curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'DELETE'); } // 通用配置 curl_setopt($ch, CURLOPT_URL, $url); curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0); curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0); curl_setopt($ch, CURLOPT_TIMEOUT, 10); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_setopt($ch, CURLOPT_HEADER, 0); // 头信息 if (! empty($header)) { curl_setopt($ch, CURLOPT_HTTPHEADER, $header); } // 执行请求 $result = curl_exec($ch); // 错误信息 // $err_no = curl_errno($ch); // $err_info = curl_getinfo($ch); // 关闭资源 curl_close($ch); // 返回 return $result; } /** * 数组转XML[解析：simplexml_load_string($param, 'SimpleXMLElement', LIBXML_NOCDATA)] * * @param array $param * @return string */ function convertXml($param = []) { // 初始化 $xml = ''; // 循环 foreach ($param as $k => $v) { $xml .= "<{$k}><![CDATA[{$v}]]></{$k}>"; } // 返回 return sprintf('<xml>%s</xml>', $xml); } /** * 写入日志|自定义文件 * * @param string $file * @param array $logs * @return bool */ function debug($file = 'debug', $logs = [], $code = 'Debug') { // 文件路径 $path = storage_path("logs/{$file}.log"); // 日志内容 $data = sprintf('[%s] %s %s%s', date('Y-m-d H:i:s'), $code, json_encode($logs, 320), PHP_EOL); // 写入日志 $result = file_put_contents($path, $data, FILE_APPEND); // 返回 return $result === false ? false : true; } /** * 导出CSV * * @param string $filename * @param string $data */ function exportCsv($filename = '', $data = array()) { header("Content-type:text/csv"); header("Content-Disposition:attachment;filename={$filename}.csv"); header('Cache-Control:must-revalidate,post-check=0,pre-check=0'); header('Expires:0'); header('Pragma:public'); $output = ''; foreach ($data as $v) { foreach ($v as $v2) { $output .= mb_convert_encoding($v2, 'GBK', 'UTF-8') . ','; } $output .= "\n"; } exit($output); } /** * 获取当前URL * * @return string */ function getCurrUrl() { $sys_protocal = isset($_SERVER['SERVER_PORT']) && $_SERVER['SERVER_PORT'] == '443' ? 'https://' : 'http://'; $php_self = $_SERVER['PHP_SELF'] ? $_SERVER['PHP_SELF'] : $_SERVER['SCRIPT_NAME']; $path_info = isset($_SERVER['PATH_INFO']) ? $_SERVER['PATH_INFO'] : ''; $relate_url = isset($_SERVER['REQUEST_URI']) ? $_SERVER['REQUEST_URI'] : $php_self . (isset($_SERVER['QUERY_STRING']) ? '?' . $_SERVER['QUERY_STRING'] : $path_info); $curr_url = $sys_protocal . (isset($_SERVER['HTTP_HOST']) ? $_SERVER['HTTP_HOST'] : '') . $relate_url; return urlencode($curr_url); } /** * 生成唯一ID * * @return string */ function uniqueId() { // 时间+随机数 return sprintf('%s%04s', date('YmdHis'), mt_rand(0, 9999)); } /** * 根据字典名称获取数据字典 * * @param string $name * @return mixed */ function getConf($name = '', $site_id = 0) { if (empty($name)) { return false; } $data = DB::table('dictionary')->where('site_id', $site_id) ->where('name', strtolower($name)) ->first(); if ($data) { // 单值模式 if ($data['type_id'] == 1) { return json_decode($data['value'], true); } elseif ($data['type_id'] == 2) { // 查询字典列表 $list = DB::table('dictionary_list')->select([ 'key_name', 'key_value' ]) ->where('dictionary_id', $data['id']) ->get() ->toArray(); return empty($list) ? [] : $list; } } return false; } /** * 格式化金额|四舍五入保留2位小数 * * @param float $money * @return string */ function moneyFormat($money = 0) { // 格式化并返回 return sprintf('%.2f', floatval($money)); } /** * 数组排序 * * @param string $key * @param array $arr * @param number $order * @return boolean|multitype */ function arrSort($key = '', $arr = [], $order = 1) { $res = []; // 产生结构数组 foreach ($arr as $k => $v) { $res[$v[$key]] = isset($res[$v[$key]]) ? array_merge($res[$v[$key]], [ $k ]) : [ $k ]; } if ($order == 1) { // 升序 ksort($res); } elseif ($order == 0) { // 降序 krsort($res); } else { return false; } $rs = []; // 组装数组 foreach ($res as $value) { foreach ($value as $n) { $rs[] = $arr[$n]; } } // 返回结果 return $rs; } /** * 计算每期的日期(当前日减一天|当月不足则取最后一天) * * @param string $start_date * @param int $total_month * @param bool $return_last * @return array|string */ function calculateDate($start_date, $total_month, $return_last = false) { // 开始时间 $start_day = intval(date('j', strtotime($start_date))); $start_time = strtotime('-1 day', strtotime($start_date)); // 当前年月日 $curr_year = intval(date('Y', $start_time)); $curr_month = intval(date('n', $start_time)); $curr_day = intval(date('j', $start_time)); // 格式化数组 $date = [ $start_date ]; // 循环计算 for ($i = 1; $i <= $total_month; $i ++) { // 年 if (($curr_month + $i) % 12 == 0) { $year = $curr_year + ($curr_month + $i) / 12 - 1; } else { $year = $curr_year + floor(($curr_month + $i) / 12); } // 月 $month = ($curr_month + $i) % 12; $month = ($month == 0 ? 12 : $month); // 日 $curr_month_days = intval(date('t', strtotime("{$year}-{$month}-01"))); $day = $start_day == 1 ? $curr_month_days : min($curr_day, $curr_month_days); // 当期时间 $date[] = sprintf('%04d-%02d-%02d', $year, $month, $day); } // 返回 if ($return_last) { // 返回最后一期 return array_pop($date); } else { // 返回所有日期 return $date; } } /** * 验证手机是否有效 */ function isMobile($subject = '') { $pattern = "/^1[3|4|5|7|8][0-9]{9}$/"; if (preg_match($pattern, $subject)) { return true; } return false; } /** * 数字转中文 * * @param unknown $num * @param number $m */ function numberToChinese($num) { $CNum = [ [ '零', '一', '二', '三', '四', '五', '六', '七', '八', '九' ], [ '', '十', '百', '千' ], [ '', '万', '亿', '万亿' ] ]; // 验证是否是数字 if (! is_numeric($num)) { return false; } $flt = ''; if (is_integer($num)) { $num = strval($num); } else if (is_numeric($num)) { $num = strval($num); $rs = explode('.', $num, 2); $num = $rs[0]; $flt = $rs[1]; } $len = strlen($num); $num = strrev($num); $chinese = ''; for ($i = 0, $k = 0; $i < $len; $i += 4, $k ++) { $tmp_str = ''; $str = strrev(substr($num, $i, 4)); $str = str_pad($str, 4, '0', STR_PAD_LEFT); for ($j = 0; $j < 4; $j ++) { if ($str{$j} !== '0') { $tmp_str .= $CNum[0][$str{$j}] . $CNum[1][4 - 1 - $j]; } } $tmp_str .= $CNum[2][$k]; $chinese = $tmp_str . $chinese; unset($str); } if ($flt !== '') { $str = ''; for ($i = 0; $i < strlen($flt); $i ++) { $str .= $CNum[0][$flt{$i}]; } $chinese .= "点{$str}"; } return $chinese; } /** * 数字金额转换成中文大写金额的函数 * String Int $num 要转换的小写数字或小写字符串 * return 大写字母 * 小数位为两位 */ function getAmount($num) { $c1 = "零壹贰叁肆伍陆柒捌玖"; $c2 = "分角元拾佰仟万拾佰仟亿"; $num = round($num, 2); $num = $num * 100; if (strlen($num) > 10) { return "数据格式错误"; } $i = 0; $c = ""; while (1) { if ($i == 0) { $n = substr($num, strlen($num) - 1, 1); } else { $n = $num % 10; } $p1 = substr($c1, 3 * $n, 3); $p2 = substr($c2, 3 * $i, 3); if ($n != '0' || ($n == '0' && ($p2 == '亿' || $p2 == '万' || $p2 == '元'))) { $c = $p1 . $p2 . $c; } else { $c = $p1 . $c; } $i = $i + 1; $num = $num / 10; $num = (int) $num; if ($num == 0) { break; } } $j = 0; $slen = strlen($c); while ($j < $slen) { $m = substr($c, $j, 6); if ($m == '零元' || $m == '零万' || $m == '零亿' || $m == '零零') { $left = substr($c, 0, $j); $right = substr($c, $j + 3); $c = $left . $right; $j = $j - 3; $slen = $slen - 3; } $j = $j + 3; } if (substr($c, strlen($c) - 3, 3) == '零') { $c = substr($c, 0, strlen($c) - 3); } if (empty($c)) { return "零元整"; } else { return $c . "整"; } }Aes 加密
在写app接口的时候，用到AES加解密，关于这块有点陌生，稍微了解了一下，这个是ECB加密，每次加密一样，更安全的需要CBC。
namespace app\common\lib; class Aes { /** * 对加密的数据进行加密 * @param $request * @return string */ public function aesEncryptRequest($request) { $res = $this->encryptPass($request,config('app.aes_key')); return $res; } /** * 加密 * @param array $request * @param string $key * @return string */ private function encryptPass($request,$key='') { $size = mcrypt_get_block_size(MCRYPT_RIJNDAEL_128,MCRYPT_MODE_ECB); $input =$this->pkcs5_pad($request,$size); $td = mcrypt_module_open(MCRYPT_RIJNDAEL_128,'',MCRYPT_MODE_ECB,''); $iv = mcrypt_create_iv(mcrypt_enc_get_iv_size($td),MCRYPT_RAND); mcrypt_generic_init($td,$key,$iv); $data = mcrypt_generic($td,$input); mcrypt_generic_deinit($td); mcrypt_module_close($td); $data = base64_encode($data); return $data; } //填充 private function pkcs5_pad($text,$blockSize) { $pad = $blockSize - (strlen($text)%$blockSize); return $text.str_repeat(chr($pad),$pad); } /** * 对数据进行AES解密 * @param $data * @return bool|string */ public function aesDecryptRequest($data) { $res = $this->decryptPass($data,config('app.aes_key')); return $res; } /** * 解密 * @param $data * @param $key * @return bool|string */ private function decryptPass($data,$key) { $decrypted = mcrypt_decrypt(MCRYPT_RIJNDAEL_128,$key, base64_decode($data), MCRYPT_MODE_ECB); $dec_s = strlen($decrypted); $padding = ord($decrypted[$dec_s-1]); $decrypted = substr($decrypted,0,-$padding); return $decrypted; } }#536
图片已删除 图片已经删除 图片不存在 图片错误 404
#537
视窗 viewport:
设备的屏幕上能用来显示我们的网页的那一块区域,而移动端还提供了两个viewport:
visual viewport(虚拟视口):
可以改变大小或形状,当前屏幕上显示的页面的一部分.
通过window.innerWidth/Height获取,会随著页面缩放而变化.
layout viewport(布局视口):
不会改变大小或形状,可以比可视化的viewport宽得多，并且包含出现在屏幕上的元素.
通过document.documentElement.clientWidth/Height获取.在Android 2, Oprea mini 和 UC 8中无法正确获取.
ideal viewport(理想视口):
不需要用户缩放和滚动就能正常的查看网站的所有内容,显示的文字大小合适,保证同样的网站在不同分辨率的设备上看起来都是一样或差不多的.
渲染过程:
1) 渲染: 将整个页面渲染在一个layout viewport中，以保证页面排版正确;
2) 缩放: 将整个layout viewport缩放到visual viewport大小，以保证页面在手机屏幕上被完整显示出来;
公式表示就是：visual viewpor = layout viewport * scale;
例如你在手机上访问一个PC页面,手机当前展示区域就是visual viewport,但是整个PC页面是很大的,往往屏幕是显示不完,所以会出现滚动条给你滑动(固定值排版的话),整个PC页面的尺寸就是layout viewport了,上面说visual viewport可以改变大小或形状,意思是你可以通过旋转屏幕或放大缩小改变显示的页面.
物理像素(physical pixel)/设备像素:
显示设备中一个最微小的物理部件.每个像素可以根据操作系统设置自己的颜色和亮度.正是这些设备像素的微小距离欺骗了我们肉眼看到的图像效果.
设备独立像素(density-independent pixel)/逻辑像素/密度无关像素:
可以认为是计算机坐标系统中的一个点，这个点代表一个可以由程序使用并控制的虚拟像素(比如CSS像素)，然后由相关系统转换为物理像素.
公式表示就是：CSS像素 = 设备独立像素 = 逻辑像素.
与设备无关的像素(device-independent pixel)/CSS像素
用于页面布局的抽象单位，用来精确度量网页上的内容,在不同的设备或不同的环境中，css中的1px所代表的设备物理像素的长度可能是不同的.
屏幕密度(pixels per inch)/像素密度:
即每英寸屏幕所拥有的像素数，像素密度越大，显示画面细节就越丰富,
公式表示就是：像素密度 = 对角线分辨率 / 屏幕尺寸.
设备像素比(device pixel ratio):
物理像素与逻辑像素之间的比例.
公式表示就是：设备像素比(dpr) = 物理像素(pp) / 设备独立像素(dip).
在JavaScript中，可以通过window.devicePixelRatio获取到当前设备的dpr.而在CSS中，可以通过-webkit-device-pixel-ratio，-webkit-min-device-pixel-ratio和 -webkit-max-device-pixel-ratio进行媒体查询，对不同dpr的设备，做一些样式适配(这里只针对webkit内核的浏览器和webview).
示例
以iPhone6S作为基准设计尺寸
设备宽高: 375pt 667pt
屏幕密度: 326ppi
visual viewport: 375px 667px
物理像素: 750pp 1334pp
CSS像素: 750px 1334px
设备独立像素: 750dip * 1334dip
设备像素比: 2dpr
某某手机
设备宽高: 375pt 667pt
visual viewport: 375px 667px
物理像素: 375pp 667pp
设备独立像素: 375dip 667dip
设备像素比: 1dpr
尽管两者CSS像素所呈现的物理尺寸是一致的，但在普通屏幕下1个CSS像素对应1个物理像素，而在Retina屏幕下，1个CSS像素对应的却是4个物理像素.靠提升单位面积屏幕的像素数量，即像素密度来提升分辨率.
(更详细内容请看The Ultimate Guide To iPhone Resolutions)
(更详细内容请看使用Flexible实现手淘H5页面的终端适配)
(还有一些常用的居中布局,经典布局方法和优缺点可以参考我之前写的文章页面基础布局相关知识 --- 居中&经典布局)
移动端必备标签
width viewport宽度(数值/device-width)
height viewport高度(数值/device-height)
initial-scale 初始缩放比例
maximum-scale 最大缩放比例
minimum-scale 最小缩放比例
user-scalable 是否允许用户缩放(yes/no)
禁止数字识自动别为电话号码
<meta name="format-detection" content="telephone=no" />忽略识别邮箱
<meta name="format-detection" content="email=no" />删除默认的苹果工具栏和菜单栏
<meta content="yes" name="apple-mobile-web-app-capable"/>设置苹果状态栏的背景颜色
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />default 默认值.
black 状态栏背景是黑色.
black-translucent 状态栏背景是黑色半透明. 如果设置为 default 或 black ,网页内容从状态栏底部开始. 如果设置为 black-translucent ,网页内容充满整个屏幕，顶部会被状态栏遮挡.
苹果添加到主屏后的标题（iOS 6 新增）
<meta name="apple-mobile-web-app-title" content="标题">苹果是否启用WebApp全屏模式
<meta name="apple-mobile-web-app-capable" content="yes" />当按百分比设定一个元素的宽度时，它是相对于父容器的宽度计算的，但是，对于一些表示竖向距离的属性，例如 padding-top , padding-bottom , margin-top , margin-bottom 等，当按百分比设定它们时，依据的也是父容器的宽度，而不是高度.
多数显示器默认频率是60Hz，即1秒刷新60次，所以理论上最小间隔为1/60＊1000ms ＝ 16.7ms.
改变输入框placeholder的颜色值
::-webkit-input-placeholder { /* WebKit browsers */ color: #999; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #999; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #999; } :-ms-input-placeholder { /* Internet Explorer 10+ */ color: #999; } input:focus::-webkit-input-placeholder{ color:#999; }旋转样式
//竖屏时样式 @media all and (orientation:portrait){} //横屏时样式 @media all and (orientation:landscape){} ###transition闪屏 ```css /设置内嵌的元素在 3D 空间如何呈现：保留3D / -webkit-transform-style: preserve-3d; / 设置进行转换的元素的背面在面对用户时是否可见：隐藏 / -webkit-backface-visibility:hidden;纯CSS创建三角形
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style media="screen"> div { width: 0; height: 0; border-top: 40px solid transparent; border-left: 40px solid transparent; border-right: 40px solid transparent; border-bottom: 40px solid #ff0000; } </style> </head> <body> <div> </div> </body> </html>input[type=number]的问题
1, maxlength属性不会提供任何反馈.
用js解决
2, form提交会默认取整数.
step属性规定<input>元素的合法数字间隔,也是通过自带箭头增减的数字,默认为1
<input type="number" name="points" step="0.01" />通过transform进行skew变形，rotate旋转会造成出现锯齿现象
Element{ -webkit-transform: rotate(-4deg) skew(10deg) translateZ(0); transform: rotate(-4deg) skew(10deg) translateZ(0); outline: 1px solid rgba(255,255,255,0) }打电话
<a href="tel:10086">打电话给:10086</a>发短信，winphone系统无效
<a href="sms:10086">发短信给: 10086</a>写邮件
第一个功能以"?"开头，后面的以"&"开头
mailto:普通邮件
cc: 收件地址后添加抄送地址（Android存在兼容问题）
bcc: 抄送地址后添加密件抄送地址（Android存在兼容问题）
subject: 包含主题
body: 包含内容，
1) 如包含文本，使用%0A给文本换行
2) 如包含http(s)://等的文本自动转化为链接
3) 如内容包含图片（PC不支持）
包含多个收件人、抄送、密件抄送人，用分号(;)隔开多个邮件人的地址
<a href="mailto:xxx@qq.com;xxx@qq.com?cc=xxx&bcc=xxx@qq.com&subject=[邮件主题]&body=xxx%0A%0Ahttp://www.baidu.com%0A%0A<img src='images/1.jpg' />">点击我发邮件</a>某些Android手机圆角失效
Element{ background-clip: padding-box; }android上去掉语音输入按钮
input::-webkit-input-speech-button {display: none}ios和android下触摸元素时出现半透明灰色遮罩
Element { -webkit-tap-highlight-color:rgba(255,255,255,0) }有些机型去除不了，不使用a或者input标签，直接用div标签
ios 设置input按钮样式会被默认样式覆盖
input, textarea { border: 0; -webkit-appearance: none; }iphone及ipad下输入框默认内阴影
Element{ -webkit-appearance: none; }Retina屏的1px边框
Element{ border-width: thin; }关于 iOS 系统中，中文输入法输入英文时，字母之间可能会出现一个六分之一空格
this.value = this.value.replace(/\u2006/g, '');IOS中input键盘事件keyup、keydown、keypress支持不是很好
html5的oninput事件代替
iOS某些时候会觉得滚动很卡
Element{ -webkit-overflow-scrolling: touch; }auto: 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止.
touch: 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果.继续滚动的速度和持续的时间和滚动手势的强烈程度成正比.同时也会创建一个新的堆栈上下文.
启动了硬件加速的特性，所以滑动起来会非常流畅；不过会影响性能
解决IOS键盘字母输入默认首字母大写
<input type="text" autocapitalize="off" />禁止长按链接与图片弹出菜单
a,img { -webkit-touch-callout: none }手机拍照和上传图片
//IOS有拍照、录像、选取本地图片功能，部分Android只有选择本地图片功能.Winphone不支持 <input type="file" accept="images/*" /> <input type="file" accept="video/*" />输入框被键盘挡住问题
if(/Android/.test(navigator.appVersion)) { window.addEventListener("resize", function() { if(document.activeElement.tagName=="INPUT" || document.activeElement.tagName=="TEXTAREA") { document.activeElement.scrollIntoView(); } }) }可以解决绝大数安卓机上面的问题
播放视频不全屏
<!-- 1.ios7+支持自动播放 2.支持Airplay的设备（如：音箱、Apple TV)播放 x-webkit-airplay="true" 3.播放视频不全屏 webkit-playsinline="true" --> <video x-webkit-airplay="true" webkit-playsinline="true" preload="auto" autoplay src="http://"></video>移动端 HTML5 audio autoplay 失效问题
苹果系统和安卓系统通常都会禁止自动播放和使用 JS 的触发播放，必须由用户来触发才可以播放.
1.audio元素的autoplay属性在IOS及Android上无法使用，在PC端正常
2.audio元素没有设置controls时，在IOS及Android会占据空间大小，而在PC端Chrome是不会占据任何空间
解决方法思路：先通过用户touchstart触碰，触发播放并暂停（音频开始加载，后面用 JS 再操作就没问题了）.
document.addEventListener('touchstart', function () { document.getElementsByTagName('audio')[0].play(); document.getElementsByTagName('audio')[0].pause(); });微信下兼容处理
document.addEventListener("WeixinJSBridgeReady", function () { music.play(); }, false);ios10+以上，尽管开发者设置了user-scalable=no，Safari还是允许用户通过手势来缩放
检测touch相关事件来阻止事件的触发
window.onload = function() { // 同时按下两个手指 document.addEventListener('touchstart', function(event) { if(event.touches.length > 1) { event.preventDefault() } }) var lastTouchEnd = 0; // 特别注意300ms时差的设置 document.addEventListener('touchend', function(event) { var now = (new Date()).getTime(); if(now-lastTouchEnd <= 300) { event.preventDefault(); } lastTouchEnd = now; }) }select下拉选择设置右对齐
select option { direction: rtl; }#538
树大招风
一路顺风
极恶非道
#539
<!DOCTYPE html> <html> <head> <title>网站标题</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <meta name="keywords" content="网站关键词"> <meta name="description" content="网站描述"> <!--初始化--><style> *{padding:0px;margin:0px;font-family: 微软雅黑, "Microsoft yahei", "Hiragino Sans GB", "冬青黑体简体中文 w3", "Microsoft Yahei", "Hiragino Sans GB", "冬青黑体简体中文 w3", STXihei, 华文细黑, SimSun, 宋体, Heiti, 黑体, sans-serif, Arial;} img{display:block;max-width:100%;} html,body{min-height:100%;} /*利用:after伪元素*/ .clearUl:after { content:""; display: block; clear: both; } /*去掉iPhone按钮样式 蓝色边框*/ input,textarea{outline:none;-webkit-appearance: none;} </style> <script> //重写alert方法，去掉地址显示 window.alert = function(name){ var iframe = document.createElement("IFRAME"); iframe.style.display="none"; iframe.setAttribute("src", 'data:text/plain,'); document.documentElement.appendChild(iframe); window.frames[0].window.alert(name); iframe.parentNode.removeChild(iframe); } //重写confirm方法，去掉地址显示 window.confirm = function(name){ var iframe = document.createElement("IFRAME"); iframe.style.display="none"; iframe.setAttribute("src", 'data:text/plain,'); document.documentElement.appendChild(iframe); var result = window.frames[0].window.confirm(name); iframe.parentNode.removeChild(iframe); return result; } </script><!--end--> </head> <body> </body> </html>#540
html代码空格影响
HTML中的换行造成空格问题
html的标签之间带不带空格或换行, 对样式有影响
html代码换行造成空格间距问题
html中连续多个空格或者多行空行的影响
HTML中的换行造成空格问题 html的标签之间的空白字符不被解析
给父元素设置字体大小为0，对于html内置的内联级标签以及表单元素标签，源代码中连续几个内联级标签中的换行在浏览器中会被解释为一个空格。
包括ie和ff。而这个空格是会被当作一个空白节点（nodeType等于3的节点，就是文字节点）。
对于html内置的块级标签使用了display:inline;则没上述问题。
对于html内置的块级标签之间的换行，ff会当作一个空白节点（用js可以获取到），ie则会忽略掉这个换行。
这个换行在ie和ff的页面上并无任何影响，不会出现空格。
#541
上传照片的时候点点动右边的clear左右来回缩进截屏等好久没得错误？//return false;favicon.ico<html> <body> <p>一打有 <del>二十</del> <ins>十二</ins> 件。</p> <p>大多数浏览器会改写为删除文本和下划线文本。</p> <p>一些老式的浏览器会把删除文本和下划线文本显示为普通文本。</p> </body> </html>"如果对方不还我,怎么办..."
if..感情值>所借金额,借
if..对方偿还能力高,只是急事,不还的概率很低,借
else..不借
因此，我们每天的生活都依靠无意识的自动化系统进行，毫无察觉，而控制系统只是偶尔出现，如果发现自己拖延，无所事事，想要启动控制系统去对抗自动化系统，则注定失败，因为控制系统每天有其注意力上限，而自动化系统永不疲倦，如同永动机一般。
作者把控制系统比作骑象人，自动化系统比作大象，真正决定我们行为的是大象，而非骑象人。
我认为原因有很多，但是最大原因在于，所有的设计都是为了取悦大象而设计，争夺骑象人的位置，大象嚷嚷着要什么，就为其设计出什么。
但问题是，这种注意力的被动式争夺最后都是不负责任的，是商业化的，我们不能从中获得某种更深刻的体验与成长，更多的都是被肤浅的表面吸引，所以我们在社交网络、社交媒体中收获的往往都是无聊与失落。
真正能够陪伴大象成长的，是骑象人的角色，其必须担当起引导者的角色，对一切信息一切诱惑，尽可能建立起更多的主动权，负起责任来。
A、有 B、没有 C、不确定
linux,unix: \r\n windows : \n Mac OS ： \r庄子曰：「鯈鱼出游从容，是鱼之乐也。」
惠子曰：「子非鱼，安知鱼之乐？」
庄子曰：「子非我，安知我不知鱼之乐？」
惠子曰：「知子莫若父。」
「当时情况就是这样。」
每次说起这个，惠子都会激动地拍着轮椅。
没学历不适合打工
对没学历的人来说，学历就是有和无的区别
苹果手机点击表情不了，没反应
#542
#543
1.先建立一个common.js文件，在common.js编写程序，
function myfunc() { console.log("myfunc...."); } module.exports.myfunc = myfunc; //暴露接口，这里不暴露不能引用在文件域js内
var common = require("../../common.js");//去链接过来，光链接过来还不行 var app; var common = require("../../common.js"); Page({ data:{ }, onLoad:function() { app = getApp(); this.setData({version:app.globalData.appName}); common.myfunc(); //最后需要执行才能生效 } })在小程序中，定义了一项工具文件utils,此文件的js旨在本文件之内有效，当其他子页面想调用其中的js方法或者变量时，需要两步骤：
1：在utils被调用的js文件中，面向对象的方式模型输出：
module.exports={要调用的函数名称：要调用的函数名称 }2：在要调用的js文件中模块化引入utils的js文件
var object=require("utils被调用的js文件地址")utils中被调用的js：
var URl='http://123.23.169'; var getImageurl=function(imageurl){ return URl+imageurl; } // 要引用这个文件的函数或者变量，除了在要引用的的js文件中模块化之外（var utils=require('js地址')）， // 在被引用的的js中要通过 module.exports={a:a}作为面向对象的变量输出函数如下： module.exports={ URl:URl,//要引用的函数 xx:xx getImageurl:getImageurl }要调用的js文件：
// 获得工具utils工具js里面函数,先模块化引用utils里面的js地址 reqiure('js地址')成一个面向对象 var utils=require('../../utils/app.js') // console.log(utils) 可查看获得的函数 console.log(utils.getImageurl('iamgeaaddress.png'))that.setData(res.data)var data=[{name:"a",age:12},{name:"b",age:11},{name:"c",age:13},{name:"d",age:14}]; for(var o in data){ alert(o); alert(data[o]); alert("text:"+data[o].name+" value:"+data[o].age ); }或是
<script type="text/javascript"> function text(){ var json = {"options":"[{/"text/":/"王家湾/",/"value/":/"9/"},{/"text/":/"李家湾/",/"value/":/"10/"},{/"text/":/"邵家湾/",/"value/":/"13/"}]"} json = eval(json.options) for(var i=0; i<json.length; i++) { alert(json[i].text+" " + json[i].value) } } </script>wx.chooseImage({ count: 1, // 默认9这个count最大只能填写9（官方文档少了这个参数的具体描述）
#544
#545
#546
#547
只要在样式里面加一句去掉css去掉iPhone、iPad的默认按钮样式就可以了。 （不要写在class里哦） input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;} textarea { -webkit-appearance: none;} 如果还有圆角的问题， .button{ border-radius: 0; } 1、去除Chrome等浏览器文本框默认发光边框 input:focus, textarea:focus {outline: none;} 去掉高光样式： input:focus{-webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-user-modify:read-write-plaintext-only;} 当然这样以来，当文本框载入焦点时，所有浏览器下的文本框的边框都不会有颜色上及样式上的变化了，这样的话，当文本框载入焦点时，边框颜色就会变为橙色，给用户一个反馈。 2、去除IE10+浏览器文本框后面的小叉叉，只需下面一句就ok了 input::-ms-clear {display: none;}#548
$res = $this->replyNews ( $articles ); } elseif ($keywordArr ['extra_text'] == 'custom_reply_news') { // 单条图文回复 $info = M ( 'custom_reply_news' )->where ( $map )->find (); // 组装微信需要的图文数据，格式是固定的 $articles [0] = array ( 'Title' => $info ['title'], 'Description' => $info ['intro'], 'PicUrl' => get_cover_url ( $info ['cover'] ), 'Url' => $this->_getNewsUrl ( $info, $param ) ); $res = $this->replyNews ( $articles ); } else { // 增加积分 add_credit ( 'custom_reply', 300 ); // 文本回复 $info = M ( 'custom_reply_text' )->where ( $map )->find (); $contetn = replace_url ( htmlspecialchars_decode ( $info ['content'] ) ); //2017.09.06 //'asdf'. if($keywordArr ['keyword']=='wxcustomservice123'){ $nowkeeff=$this->kfzzxx(); //$contetn = htmlspecialchars_decode($nowkeeff['kf_list'][0]['kf_account']); $contentnew='当前客服：'."\n\r"; foreach($nowkeeff['kf_list'] as $nk=>$nv){ $contentnew.= ($nk+1).'、'.$nv['kf_nick']."\n\r"; } if(!(count($nowkeeff['kf_list']))) $contentnew.='暂无客服人员接入。'; else $contentnew.='正在为您转接人工客服'; $contetn = ($contentnew);//htmlspecialchars_decode /*$articles [0] = array ( 'Title' => '当前客服：', 'Description' => $contentnew, 'PicUrl' => get_cover_url ( $info ['cover'] ), 'Url' => $this->_getNewsUrl ( $info, $param ) ); $res = $this->replyNews ( $articles ); exit;*/ //$articles [0]['Title']='fads';//.$keywordArr ['keyword'];//$nowkeeff['kf_list'][0]['kf_account']; } //end $this->replyText ( $contetn ); } } //获取在线客服 function kfzzxx(){ //exit; $access_token=get_access_token(); $url='https://api.weixin.qq.com/cgi-bin/customservice/getkflist?access_token='.$access_token; $content = file_get_contents($url); //echo $sss=$this->get_web_page($url); return $sss=json_decode($content, true); //dump($content); //header('Location:'.$url); //exit; }/Addons/CustomReply/Model/WeixinAddonModel.class.phpphp 中去除中文的换行，str_replace(PHP_EOL,'',($res['share_content']))；<?php $jsapi_ticket=get_jsapi_ticket(); //$access_token=get_access_token(); $appinfo=get_token_appinfo(); require_once "jssdk.php"; $jssdk = new JSSDK($appinfo['appid'],$appinfo['secret'],$access_token=0,$jsapi_ticket); $signPackage = $jssdk->GetSignPackage(); //dump($signPackage); ?> <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script> <script> /* * 注意： * 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。 * 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。 * 3. 常见问题及完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html * * 开发中遇到问题详见文档“附录5-常见错误及解决办法”解决，如仍未能解决可通过以下渠道反馈： * 邮箱地址：weixin-open@qq.com * 邮件主题：【微信JS-SDK反馈】具体问题 * 邮件内容说明：用简明的语言描述问题所在，并交代清楚遇到该问题的场景，可附上截屏图片，微信团队会尽快处理你的反馈。 */ //console.log('fdasfdas'); wx.config({ /*debug: true,*/ appId: '<?php echo $signPackage["appId"];?>', timestamp: <?php echo $signPackage["timestamp"];?>, nonceStr: '<?php echo $signPackage["nonceStr"];?>', signature: '<?php echo $signPackage["signature"];?>', jsApiList: [ // 所有要调用的 API 都要加到这个列表中 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone' ] }); wx.ready(function () { // 在这里调用 API wx.onMenuShareTimeline({ imgUrl: 'http://***lizhenqiu.com/222.jpg' }); wx.onMenuShareAppMessage({ desc: '地址：<?php echo $config['xl_dz'];?>\n电话：<?php echo $config['xl_man'];?>', // 分享描述 imgUrl: 'http://***lizhenqiu.com/222.jpg' }); wx.onMenuShareQQ({ desc: '地址：<?php echo $config['xl_dz'];?>\n电话：<?php echo $config['xl_man'];?>', // 分享描述 imgUrl: 'http://***lizhenqiu.com/222.jpg' }); wx.onMenuShareWeibo({ desc: '地址：<?php echo $config['xl_dz'];?>\n电话：<?php echo $config['xl_man'];?>', // 分享描述 imgUrl: 'http://***lizhenqiu.com/222.jpg' }); wx.onMenuShareQZone({ desc: '地址：<?php echo $config['xl_dz'];?>\n电话：<?php echo $config['xl_man'];?>', // 分享描述 imgUrl: 'http://***lizhenqiu.com/222.jpg' }); }); </script>// 判断公众号的类型：是订阅号还是服务号 function get_token_type($token = '') { $info = get_token_appinfo ( $token ); return intval ( $info ['type'] ); } // 获取jsapi_ticket，自动带缓存功能 function get_jsapi_ticket($token = '') { empty ( $token ) && $token = get_token (); $key = 'jsapi_ticket_' . $token; $res = S ( $key ); if ($res !== false) return $res; $info = get_token_appinfo ( $token ); if (empty ( $info ['appid'] ) || empty ( $info ['secret'] )) { S ( $key, 0, 7200 ); return 0; } $accessToken=get_access_token(); $url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken"; $tempArr = json_decode ( file_get_contents ( $url ), true ); //dump($tempArr);exit; if (@array_key_exists ( 'ticket', $tempArr )) { S ( $key, $tempArr ['ticket'], 7200 ); return $tempArr ['ticket']; } else { return 0; } } // 获取access_token，自动带缓存功能 function get_access_token($token = '') { empty ( $token ) && $token = get_token (); $key = 'access_token_' . $token; $res = S ( $key ); if ($res !== false) return $res; $info = get_token_appinfo ( $token ); if (empty ( $info ['appid'] ) || empty ( $info ['secret'] )) { S ( $key, 0, 7200 ); return 0; } $url = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=' . $info ['appid'] . '&secret=' . $info ['secret']; // 如果是企业号用以下URL获取access_token //if(intval ( $info ['type'] )==1) $url = 'https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=' . $info ['appid'] . '&corpsecret=' . $info ['secret']; $tempArr = json_decode ( file_get_contents ( $url ), true ); if (@array_key_exists ( 'access_token', $tempArr )) { S ( $key, $tempArr ['access_token'], 7200 ); return $tempArr ['access_token']; } else { return 0; } }<?php class JSSDK { private $appId; private $appSecret; private $access_token; private $jsapi_ticket; public function __construct($appId, $appSecret,$access_token,$jsapi_ticket) { $this->appId = $appId; $this->appSecret = $appSecret; $this->access_token = $access_token; $this->jsapi_ticket = $jsapi_ticket; } public function getSignPackage() { $jsapiTicket = $this->jsapi_ticket;//$this->getJsApiTicket(); // 注意 URL 一定要动态获取，不能 hardcode. $protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://"; $url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"; $timestamp = time(); $nonceStr = $this->createNonceStr(); // 这里参数的顺序要按照 key 值 ASCII 码升序排序 $string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url"; $signature = sha1($string); $signPackage = array( "appId" => $this->appId, "nonceStr" => $nonceStr, "timestamp" => $timestamp, "url" => $url, "signature" => $signature, "rawString" => $string ); return $signPackage; } private function createNonceStr($length = 16) { $chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"; $str = ""; for ($i = 0; $i < $length; $i++) { $str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1); } return $str; } private function getJsApiTicket() { return $this->jsapi_ticket; // jsapi_ticket 应该全局存储与更新，以下代码以写入到文件中做示例 $data = json_decode($this->get_php_file("jsapi_ticket.php")); if ($data->expire_time < time()) { $accessToken = $this->getAccessToken(); // 如果是企业号用以下 URL 获取 ticket $url = "https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket?access_token=$accessToken"; //$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken"; $res = json_decode($this->httpGet($url)); $ticket = $res->ticket; if ($ticket) { $data->expire_time = time() + 7000; $data->jsapi_ticket = $ticket; $this->set_php_file("jsapi_ticket.php", json_encode($data)); } } else { $ticket = $data->jsapi_ticket; } return $ticket; } private function getAccessToken() { return $this->access_token; // access_token 应该全局存储与更新，以下代码以写入到文件中做示例 $data = json_decode($this->get_php_file("access_token.php")); if ($data->expire_time < time()) { // 如果是企业号用以下URL获取access_token $url = "https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=$this->appId&corpsecret=$this->appSecret"; //$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$this->appId&secret=$this->appSecret"; $res = json_decode($this->httpGet($url)); $access_token = $res->access_token; if ($access_token) { $data->expire_time = time() + 7000; $data->access_token = $access_token; $this->set_php_file("access_token.php", json_encode($data)); } } else { $access_token = $data->access_token; } return $access_token; } private function httpGet($url) { $curl = curl_init(); curl_setopt($curl, CURLOPT_RETURNTRANSFER, true); curl_setopt($curl, CURLOPT_TIMEOUT, 500); // 为保证第三方服务器与微信服务器之间数据传输的安全性，所有微信接口采用https方式调用，必须使用下面2行代码打开ssl安全校验。 // 如果在部署过程中代码在此处验证失败，请到 http://curl.haxx.se/ca/cacert.pem 下载新的证书判别文件。 curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE); curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE); curl_setopt($curl, CURLOPT_URL, $url); $res = curl_exec($curl); curl_close($curl); return $res; } private function get_php_file($filename) { return trim(substr(file_get_contents($filename), 15)); } private function set_php_file($filename, $content) { $fp = fopen($filename, "w"); fwrite($fp, "<?php exit();?>" . $content); fclose($fp); } }\r回到行首 \n换行\n是换行，英文是New line，表示使光标到行首
\r是回车，英文是Carriage return，表示使光标下移一格
\r\n表示回车换行
我们在平时使用电脑时，已经习惯了回车和换行一次搞定，敲一个回车键，即是回车，又是换行。
1、\n 软回车：
在Windows 中表示换行且回到下一行的最开始位置。相当于Mac OS 里的 \r 的效果。
在Linux、unix 中只表示换行，但不会回到下一行的开始位置。
2、\r 软空格：
在Linux、unix 中表示返回到当行的最开始位置。
在Mac OS 中表示换行且返回到下一行的最开始位置，相当于Windows 里的 \n 的效果。
3、\t 跳格（移至下一列）。
它们在双引号或定界符表示的字符串中有效，在单引号表示的字符串中无效。
\r\n 一般一起用，用来表示键盘上的回车键，也可只用 \n。
\t表示键盘上的“TAB”键。
就像你使用 enter和shift+enter的区别
4、文件中的换行符号：
linux,unix: \r\n windows : \n Mac OS ： \r5、常用转义符号的意义：
\n LF或ASCII中的0x0A(10) \r CR或ASCII中的0x0D(13) \t 水平制表符-HT或ASCII中的0x09（9） \\ 反斜杠 \$ 美圆符 \" 双引号 \' 单引号6、"\r\n"与"</br>"的区别
\r\n是输出的HTML代码换行，客户看到的效果没有换行。
如果是输出给浏览器，就用<br/>
\r\n，好比你在DreamWeaver里做一个网页，在源代码里按一下回车，是给源代码回车换行。
是输出一个（HTML标记性语言），在HTML中解释为输入的字换行。 \r\n的作用是给源代码回车换行，输入后，查看html源代码，就看会到有换行，而HTML解释器（浏览器）认为它是没用的东西，用不用都一样显示。
$info = M ( 'custom_reply_text' )->where ( $map )->find ();
$contetn = replace_url ( htmlspecialchars_decode ( $info ['content'] ) );
//if(!$content) $content='暂无客服人员接入。';
//2017.09.06
//'asdf'.
if($keywordArr ['keyword']=='wxcustomservice123' || !$content){
// 文本回复 $info = M ( 'custom_reply_text' )->where ( $map )->find (); $contetn = replace_url ( htmlspecialchars_decode ( $info ['content'] ) ); //if(!$content) $content='暂无客服人员接入。'; //2017.09.06 //'asdf'. if($keywordArr ['keyword']=='wxcustomservice123' || !$content){#549
用js监视用户浏览器的大小变动
js 页面宽度 js 监听页面宽度变化 js 监听页面宽度变化 js监控页面变化
js获取浏览器和设备相关width（屏幕的宽度）
<!-----banner 开始------> <style> .device {width:100%;height: 100%;background: #111; position: relative;} /*------------------左右按钮-----------------*/ /*.device .arrow-left {background: url(img/arrows.png) no-repeat left top;position: absolute;left: 10px;top: 50%;margin-top: -15px;width: 17px; height: 30px;} .device .arrow-right {background: url(img/arrows.png) no-repeat left bottom; position: absolute; right: 10px; top: 50%; margin-top: -15px; width: 17px; height: 30px;}*/ .swiper-container {width:100%;height:100%;} .content-slide {padding: 20px;color: #fff;} .title {font-size: 25px;margin-bottom: 10px;} .pagination {position: absolute;z-index: 20;bottom:17px;width: 100%;text-align: center;} .swiper-pagination-switch {display: inline-block;width:8px;height: 8px; border-radius: 8px;background-color:#ffd17d;margin: 0 5px;opacity: 0.8;cursor: pointer;display: block;margin-left: 18px;display: inline-block;border-radius:25px;-moz-border-radius:25px;} .swiper-active-switch {background:transparent;border: 1px solid #ffd17d;opacity: 1;width:10px;height:10px;display: block;display: inline-block;border-radius:25px;-moz-border-radius:25px;margin-bottom:-1px;} .bj>.in_news>.neih>.xinw>a>.meige>.ner>p{height:38px;} </style> <div class="device"> <a class="arrow-left" href="javascript:;"></a> <a class="arrow-right" href="javascript:;"></a> <div class="swiper-container"> <div class="swiper-wrapper"> <foreach name="blist" item="r" key="k" > <div class="swiper-slide"><div class="jqthumb" style="width: 100%px; height: 600px; opacity: 1;"><div style="width: 100%; height: 100%; background-image: url({$r.img_path}); background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;"></div></div></div> </foreach> <!-- <div class="swiper-slide"><div class="jqthumb" style="width: 100%px; height: 600px; opacity: 1;"><div style="width: 100%; height: 100%; background-image: url(images/index_19.png); background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;"></div></div></div> <div class="swiper-slide"><div class="jqthumb" style="width: 100%px; height: 600px; opacity: 1;"><div style="width: 100%; height: 100%; background-image: url(images/index_19.png); background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;"></div></div> </div> --> </div> </div> <div class="pagination"></div> </div> <script src="js/idangerous.swiper.min.js"></script> <script> var mySwiperhtml; $(document).ready(function(){ if(!mySwiperhtml) mySwiperhtml=$('.swiper-container').html(); newssspptttt(); var nwesswidttth=document.body.clientWidth; window.onresize = function(){ if(nwesswidttth!=document.body.clientWidth){ if(mySwiper) $('.swiper-container').html(mySwiperhtml); newssspptttt(); } } }); var mySwiper; function newssspptttt(){ /*if(mySwiper){ //mySwiper.removeAllSlides(); $('.swiper-container').html(mySwiperhtml); mySwiper.appendSlide(mySwiperhtml); mySwiper.startAutoplay(); }*/ mySwiper = new Swiper('.swiper-container',{ autoplay : 5000,//可选选项，自动滑动 loop : true,//可选选项，开启循环 calculateHeight : true, pagination : '.pagination', paginationClickable :true, roundLengths : true,slidesPerView : 1,autoResize : false, }); $('#sdafasdfdsimgmmm').hide(); $(".swiper-slide img").each(function(){ $(this).show(); });} </script> <!-----banner 结束------>if(isNew){ $('#newstop-wrapper').append(html); topSwiper = new Swiper('#newstop', { pagination : '.swiper-pagination', loop : true, autoplay : 5000, preventClicks : false, preventLinksPropagation : true, width : window.innerWidth, autoplayDisableOnInteraction : false, observer : true }); } else { topSwiper.stopAutoplay(); topSwiper.removeAllSlides(); if($.trim(html) != ""){ topSwiper.appendSlide(html); topSwiper.startAutoplay(); } }#550
#551
\app\system\include\public\js\examples\editor\ueditor\dialogs\insertframe<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <script type="text/javascript" src="../internal.js"></script> <style type="text/css"> .warp {width: 320px;height: 153px;margin-left:5px;padding: 20px 0 0 15px;position: relative;} #url {width: 290px; margin-bottom: 2px; margin-left: -6px; margin-left: -2px\9;*margin-left:0;_margin-left:0; } .format span{display: inline-block; width: 58px;text-align: center; zoom:1;} table td{padding:5px 0;} #align{width: 65px;height: 23px;line-height: 22px;} </style> </head> <body> <div class="warp"> <table width="300" cellpadding="0" cellspacing="0"> <tr> <td colspan="2" class="format"> <!--<span><var id="lang_input_address"></var></span>--> <textarea id="url" style="width:280px" rows="6"></textarea> <!--<input style="width:200px" id="url" type="text" value=""/>--> </td> </tr> <tr> <td colspan="2" class="format"><span><var id="lang_input_width"></var></span><input style="width:200px" type="text" value="100%" id="width"/> </td> </tr> <tr> <td colspan="2" class="format"><span><var id="lang_input_height"></var></span><input style="width:200px" type="text" value="300" id="height"/> </td> </tr> <tr style="display:none;"> <td><span><var id="lang_input_isScroll"></var></span><input type="checkbox" id="scroll"/> </td> <td><span><var id="lang_input_frameborder"></var></span><input type="checkbox" id="frameborder"/> </td> </tr> <tr style="display:none;"> <td colspan="2"><span><var id="lang_input_alignMode"></var></span> <select id="align"> <option value=""></option> <option value="left"></option> <option value="right"></option> </select> </td> </tr> </table> </div> <script type="text/javascript"> var iframe = editor._iframe; if(iframe){ $G("url").value = iframe.getAttribute("src")||""; $G("width").value = iframe.getAttribute("width")||iframe.style.width.replace("px","")||""; $G("height").value = iframe.getAttribute("height") || iframe.style.height.replace("px","") ||""; $G("scroll").checked = (iframe.getAttribute("scrolling") == "yes") ? true : false; $G("frameborder").checked = (iframe.getAttribute("frameborder") == "1") ? true : false; $G("align").value = iframe.align ? iframe.align : ""; } function queding(){ var url = $G("url").value.replace(/^\s*|\s*$/ig,""), width = $G("width").value, height = $G("height").value, scroll = $G("scroll"), frameborder = $G("frameborder"), float = $G("align").value, newIframe = editor.document.createElement("iframe"), div; if(!url){ alert(lang.enterAddress); return false; } urlsss = url.replace(/'/g,'"'); //alert(url); var reg = /(?<=(src="))[^"]*?(?=")/ig; var allSrc = urlsss.match(reg); //alert(allSrc); if(allSrc) url = allSrc; newIframe.setAttribute("src",/http:\/\/|https:\/\//ig.test(url) ? url : "http://"+url); // /^[1-9]+[.]?\d*$/g.test( width ) ? newIframe.setAttribute("width",width) : ""; newIframe.setAttribute("width",width); // /^[1-9]+[.]?\d*$/g.test( height ) ? newIframe.setAttribute("height",height) : ""; newIframe.setAttribute("height",height); scroll.checked ? newIframe.setAttribute("scrolling","yes") : newIframe.setAttribute("scrolling","no"); frameborder.checked ? newIframe.setAttribute("frameborder","1",0) : newIframe.setAttribute("frameborder","0",0); float ? newIframe.setAttribute("align",float) : newIframe.setAttribute("align",""); //newIframe=$G("url").value; if(iframe){ iframe.parentNode.insertBefore(newIframe,iframe); domUtils.remove(iframe); }else{ div = editor.document.createElement("div"); div.appendChild(newIframe); editor.execCommand("inserthtml",div.innerHTML); } editor._iframe = null; dialog.close(); } dialog.onok = queding; $G("url").onkeydown = function(evt){ evt = evt || event; if(evt.keyCode == 13){ queding(); } }; $focus($G( "url" )); </script> </body> </html>