最新评论 - 第 113 页

广西南宁市 2016-11-04 10:14

#0

阅读 2806.5万

常用html、demo代码

网页滚动条拉到最低端

$(document).height() == $(window).height() + $(window).scrollTop()

当网页高度不足浏览器窗口时$(document).height()返回的是$(window).height()
$("body").height()：body可能会有边框，获取的高度会比$(document).height()小；
$("html").height()：在不同的浏览器上获取的高度的意义会有差异，说白了就是浏览器不兼容。
$(window).height()值有问题，返回的不是浏览器窗口的高度？
原因：网页没有加上<!DOCTYPE>声明。

查看文章跳到评论

广西南宁市 2016-11-04 10:11

#0

阅读 2806.5万

常用html、demo代码

使用jquery中height()方法获取各种高度大全

alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height());//浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width());//浏览器当前窗口文档对象宽度
alert($(document.body).width());//浏览器当前窗口文档body的高度
alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin

查看文章跳到评论

北京市 2016-11-04 00:42

#0

阅读 628.7万

他不是脾气暴躁，只是不能被打扰

滚动闪
原因：滚动固定的时候，原来的菜单导航高度0不在文档流里面，导致文档高度变化变小减去文档流外的后固定导航栏

查看文章跳到评论

北京市 2016-11-04 00:40

#0

阅读 88.6万

简洁七牛图床图片上传外链源码

Js/Jquery获取input file的文件名

html代码:
    <input type="file" name="file" id="file" class="input_text80"></input>
js:
方法一：字符串截取
var file = $("#file").val();
var fileName = getFileName(file);
 
function getFileName(o){
    var pos=o.lastIndexOf("\\");
    return o.substring(pos+1);  
}
 
方法二：正则表达式
var file = $("#file").val();
var strFileName=file.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi,"$1");  //正则表达式获取文件名，不带后缀
var FileExt=file.replace(/.+\./,"");   //正则表达式获取后缀

查看文章跳到评论

北京市 2016-11-04 00:39

#0

阅读 88.6万

简洁七牛图床图片上传外链源码

JavaScript 获取当前时间戳：
第一种方法：

var timestamp = Date.parse(new Date());
结果：1280977330000

第二种方法：

var timestamp = (new Date()).valueOf();
结果：1280977330748

第三种方法：

var timestamp=new Date().getTime()；
结果：1280977330748

第一种：获取的时间戳是把毫秒改成000显示，
第二种和第三种是获取了当前毫秒的时间戳。

查看文章跳到评论

北京市 2016-11-04 00:37

#0

阅读 88.6万

简洁七牛图床图片上传外链源码

七牛自定义资源下载名

http://qiniuphotos.qiniudn.com/gogopher.jpg?download/test.jpg

查看文章跳到评论

北京市 2016-11-04 00:36

#0

阅读 88.6万

简洁七牛图床图片上传外链源码

公盘网盘上传代码

<?php
require_once  'vendor/autoload.php';
header('Access-Control-Allow-Origin:*');
use Qiniu\Auth;
$bucket = 'wailian';
$accessKey = '';
$secretKey = '';
$auth = new Auth($accessKey, $secretKey);
//$upToken = $auth->uploadToken($bucket);
$policy = array(
    'returnUrl' => 'http://pan.lizhenqiu.com/fileinfo.php',
    'returnBody' => '{"fname": $(key)}',
);
$upToken = $auth->uploadToken($bucket, null, 3600, $policy);
?><!DOCTYPE html>
<html>
<head>
<title>公盘 -lizhenqiu.com</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no" />
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/ecmascript" src="md5.js"></script>

<style>@supports (display:none) {
      dot {
        display: inline-block; 
        width: 3ch;
        text-indent: -1ch;
        vertical-align: bottom; 
        overflow: hidden;
        animation: dot 3s infinite step-start both;
        /* 等宽字体很重要 */
        font-family: Consolas, Monaco, monospace;
    }
}

@keyframes dot {
    33% { text-indent: 0; }
    66% { text-indent: -2ch; }
}</style></head>

<body>
<p>请填写标题、简介、选择要上传的RAR文件包</p>
<div id="ddimgupoloing" style="display:none;color: red;">正在上传文件<dot>...</dot></div>


<form id="myform" autocomplete="off" name="myform" onsubmit="return check();" method="post" action="http://up.qiniu.com" enctype="multipart/form-data">
<input name="key" id="key" type="hidden" value="">
  <input name="token" type="hidden" value="<?php echo $upToken;?>">
  <p><input name="title" type="text" autocomplete="off" id="intitle" placeholder="请填写标题" /></p>
  <p><input name="jianjie" type="text" autocomplete="off" id="injianjie" placeholder="请填写简介" /></p>
  <p><input name="file" autocomplete="off" id="f" type="file" style="
    background: #eee;
    border: 1px solid #eee;
    border-right: 1px solid #000;
" /></p>
  <input type="submit" value="Submit" style="display:none;" />
</form><script type="text/javascript">

function asq(title,jianjie,durl,types){
	$.ajax( {
		url: '/up.php?title='+title+'&jianjie='+jianjie+'&durl='+durl+'&types='+types, //这里是静态页的地址
		type: "GET", //静态页用get方法，否则服务器会抛出405错误
		//dataType: "json",
		//cache: false,
		//async: false,
		beforeSend: function(){
		 // Handle the beforeSend event
		},
		success: function(data){
			//var result = $(data).find("另一个html页面的指定的一部分").html();
			return true;
		}
	});
	return false;
}


	function check(){
		var s=$('#f').val();
		var injianjie=$('#injianjie').val();
		var intitle=$('#intitle').val();
		if(!intitle){
			//alert('请填写标题');
			//location.href = '/out.php';
			var strFileName=s.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi,"$1");
			$('#intitle').val(strFileName);
			timedMsg();
			return false;
		}
		if(!injianjie){
			//alert('请填写简介');
			var strFileName=s.replace(/^.+?\\([^\\]+?)(\.[^\.\\]*?)?$/gi,"$1");
			$('#injianjie').val(strFileName);
			timedMsg();
			//location.href = '/out.php';
			return false;
		}
		
		var types=selectFile(document.getElementById("f"));
		
		//alert(s);
		var h=$('#key').val();
		if(!s || h) return false;
		var timestamp = Date.parse(new Date());
		var hash = hex_md5(s)+timestamp;
		
		$('#key').val(hash);
		asq(intitle,injianjie,hash,types);
	}
function selectFile(input) {
 
    var fileName = input.value;
    if(fileName.length > 1 && fileName ) {       
        var ldot = fileName.lastIndexOf(".");
        var type = fileName.substring(ldot + 1);
        return type;
        if(type != "rar") {
            alert('请上传rar压缩包文件');
			location.href = '/out.php';
            //清除当前所选文件
            input.outerHTML=input.outerHTML.replace(/(value=\").+\"/i,"$1\"");
			return false;
        }
    }
	return false;
	//return true;
}
function timedMsg()
　　{
	var s=$('#f').val();
	if(s){
		check();
		var h=$('#key').val();
		if(h){
			$('#myform').css('display','none');
			$('#ddimgupoloing').css('display','');
			document.getElementById("myform").submit();
		}
		return false;
	}
　　setTimeout("timedMsg()",1000);
　　}
setTimeout("timedMsg()",3000);
</script>  

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- blog -->
<ins class="adsbygoogle"
     style="display:inline-block;width:320px;height:100px"
     data-ad-client="ca-pub-7446801070784593"
     data-ad-slot="7895142255"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>


</body>

</html>

查看文章跳到评论

广西南宁市 2016-11-03 17:51

#0

阅读 88.6万

简洁七牛图床图片上传外链源码

在七牛回调的中，是否有返回文件大小属性。属性是什么
上传策略的callbackBody字段设置fsize这个魔法变量即可：
http://developer.qiniu.com/docs/v6/api/overview/up/response/vars.html#magicvar

php的话就是生成token的地方

 $bucket = Config::BUCKET_NAME;
 $accessKey = Config::ACCESS_KEY;
 $secretKey = Config::SECRET_KEY;
 $auth = new Auth($accessKey, $secretKey);

 $policy = array(
 'callbackUrl' => 'http://172.30.251.210/callback.php',
 'callbackBody' => '{"fname":"$(fname)","fsize":"$(fsize)","fkey":"$(key)","desc":"$(x:desc)","uid":' . $uid . '}'
);

 $upToken = $auth->uploadToken($bucket, null, 3600, $policy);

header('Access-Control-Allow-Origin:*');
 echo $upToken;

查看文章跳到评论

广西南宁市 2016-11-03 17:49

#0

阅读 2806.5万

常用html、demo代码

a链接点击执行js代码

<a href="javascript: alert('test');">

查看文章跳到评论

广西南宁市 2016-11-03 14:23

#0

阅读 628.7万

他不是脾气暴躁，只是不能被打扰

有人问我为什么每天一上班就犯困想睡觉...或许是因为，工作是梦开始的地方吧

查看文章跳到评论

广西南宁市 2016-11-02 18:03

#0

阅读 64万

百度地图显示多个标注点

百度地图手机移动端版天材医疗器械联系我们

<script type="text/javascript" src="http://api.map.baidu.com/api?type=quick&ak=X8u8xx9GzO88EIydfLbTsvbK&v=1.0"></script>

<!---------------------------------- 地图开始 ---------------------------------->
<div class="lxfsditu"  id="map" style="border:1px solid #ccc; width:15rem; height:11.85rem;">
</div>
<!---------------------------------- 地图结束 ---------------------------------->

<script type="text/javascript">
	// 百度地图API功能
	var map = new BMap.Map("map");
	map.centerAndZoom(new BMap.Point(108.312475,22.772913), 14);

	map.addControl(new BMap.ZoomControl());  //添加地图缩放控件
	var marker1 = new BMap.Marker(new BMap.Point(108.312475,22.772913));  //创建标注
	map.addOverlay(marker1);                 // 将标注添加到地图中
	//创建信息窗口
	var infoWindow1 = new BMap.InfoWindow("广西天材医疗器械有限公司<br>南宁市金凯路11号荣港城二期12座16楼E号");
	marker1.addEventListener("click", function(){this.openInfoWindow(infoWindow1);});
	</script>

查看文章跳到评论

广西南宁市 2016-11-02 18:01

#0

阅读 64万

百度地图显示多个标注点

百度地图PC版代码

<div class="ditu" id="map" style="width:900px; height:396px; border:1px solid #ccc; margin:15px auto 0 auto;"></div>
<script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript"></script>
<script type="text/javascript">
    //创建和初始化地图函数：
    function initMap(){
        createMap();//创建地图
        setMapEvent();//设置地图事件
        addMapControl();//向地图添加控件
        addMapOverlay();//向地图添加覆盖物
    }
    function createMap(){
        map = new BMap.Map("map");
        map.centerAndZoom(new BMap.Point(<?php echo $longitude;?>,<?php echo $latitude;?>),19);
    }
    function setMapEvent(){
        map.enableScrollWheelZoom();
        map.enableKeyboard();
        map.enableDragging();
        map.enableDoubleClickZoom()
    }
    function addClickHandler(target,window){
        target.addEventListener("click",function(){
            target.openInfoWindow(window);
        });
    }
    function addMapOverlay(){
        var markers = [
            {content:"<?php echo $address;?>",title:"<?php echo $company;?>",imageOffset: {width:-46,height:-21 },position:{lat:<?php echo $latitude;?>,lng:<?php echo $longitude;?>}}
        ];
        for(var index = 0; index < markers.length; index++ ){
            var point = new BMap.Point(markers[index].position.lng,markers[index].position.lat);
            var marker = new BMap.Marker(point,{icon:new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png",new BMap.Size(20,25),{
                imageOffset: new BMap.Size(markers[index].imageOffset.width,markers[index].imageOffset.height)
            })});
            var label = new BMap.Label(markers[index].title,{offset: new BMap.Size(25,5)});
            var opts = {
                width: 200,
                title: markers[index].title,
                enableMessage: false
            };
            var infoWindow = new BMap.InfoWindow(markers[index].content,opts);
            marker.setLabel(label);
            addClickHandler(marker,infoWindow);
            map.addOverlay(marker);
        };
    }
    //向地图添加控件
    function addMapControl(){
        var scaleControl = new BMap.ScaleControl({anchor:BMAP_ANCHOR_BOTTOM_LEFT});
        scaleControl.setUnit(BMAP_UNIT_IMPERIAL);
        map.addControl(scaleControl);
        var navControl = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
        map.addControl(navControl);
        var overviewControl = new BMap.OverviewMapControl({anchor:BMAP_ANCHOR_BOTTOM_RIGHT,isOpen:false});
        map.addControl(overviewControl);
    }
    var map;
    initMap();
</script>

查看文章跳到评论

广西南宁市 2016-11-02 18:00

#0

阅读 64万

百度地图显示多个标注点

广羽人门店分布地图多点标注2
添加设置覆盖物标注点文字标签

<GZ:list sql="select * from gz_mendianbiaozhu where status='1' order by listorder desc" key='i'>

<?php
$meidanfenbu[]=$r;
?>
</GZ:list>
<!---------------------------------------- 栏目 start ---------------------------------------->
<div class="lanmu">
   <ul class="xuanxiang xuanxiangnew-lij clearfix"><include file="A:l"/>
   </ul>
</div>
<!---------------------------------------- 栏目 end ---------------------------------------->

<?php
	$zms=array(
		'1'=>'A',
		'2'=>'B',
		'3'=>'C',
		'4'=>'D',
		'5'=>'E',
		'6'=>'F',
		'7'=>'G',
		'8'=>'H',
		'9'=>'I',
		'10'=>'J',
		'11'=>'K',
		'12'=>'L',
		'13'=>'M',
		'14'=>'N',
		'15'=>'O',
		'16'=>'P',
		'17'=>'Q',
		'18'=>'R',
		'19'=>'S',
		'20'=>'T',
		'21'=>'U',
		'22'=>'V',
		'23'=>'W',
		'24'=>'X',
		'25'=>'Y',
		'26'=>'Z'
	);
?>

<!---------------------------------------- 门店分布内容 start ---------------------------------------->
<div class="mdfbbox">
   <div class="fbbt">广西南宁市范围广羽人门店分布地图：</div>
   <div class="gxditu" id="map" style="width:900px; height:365px; border:1px solid #ccc;"></div>
   <div class="fbbt" style="margin-top:30px;">广西南宁市广羽人所有店铺地址：</div>
   
   <div class="fbdzlf" style="width:900px;    border-right: none;"><?php
	foreach($meidanfenbu as $i=>$r){
	$ik++;
	if($nnssvs) $nnssvs.= ',{ title: "'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	else $nnssvs= '{ title: "名称：'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	$lns=explode(',',$r['zuobo']);
	$ln=$lns['0'];
	$la=$lns['1'];
   ?>
		  
		<div onclick="getdddsnew('{$ln}','{$la}','{$r.mingc}','{$r.dizhi}','{$r.tel}');" style="cursor: pointer;float:left;<?php
			if(($i%2)) echo 'width:425px;margin-left: 25px;';
			else echo 'width:448px;    border-right: 1px dashed #ccc;';
			//if($i>2) echo 'margin-top: 15px;';
		?>padding-bottom:15px;">
      <div style="width:100%;" class="dianming"><span style="color:red;"><?php echo $zms[$ik];?></span> {$r.mingc}</div>
      <P style="width:100%;" class="diandizhi" style="margin-bottom:15px;">{$r.dizhi}</P></div>
      <?php
	  }
	  
	  ?>
   </div>
   
  
</div>
<!---------------------------------------- 门店分布内容 end ---------------------------------------->


<script>
	var load = document.createElement("script");  
	load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
	document.body.appendChild(load); 

var markerArr = [ 
	<?php echo $nnssvs;?>
	//{ title: "名称：金外滩商务大厦", point: "108.33058,22.815521", address: "金外滩商务大厦1301"},
	//{ title: "名称：人民公园", point: "108.336858,22.83404", address: "人民公园地址<br>电话13607875450 "}
];  
  
                //var map; //Map实例  
				//map = new BMap.Map("map"); 
                function map_init() {  
                    map = new BMap.Map("map");
                    //第1步：设置地图中心点，南宁市政府  
                    var point = new BMap.Point(108.33058,22.815521);  
                    //第2步：初始化地图,设置中心点坐标和地图级别。  
                    map.centerAndZoom(point, 13);  
                    //第3步：启用滚轮放大缩小  
                    map.enableScrollWheelZoom(true);  
                    //第4步：向地图中添加缩放控件  
                    var ctrlNav = new window.BMap.NavigationControl({  
                        anchor: BMAP_ANCHOR_TOP_LEFT,  
                        type: BMAP_NAVIGATION_CONTROL_LARGE  
                    });  
                    map.addControl(ctrlNav);  
                    //第5步：向地图中添加缩略图控件  
                    var ctrlOve = new window.BMap.OverviewMapControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_RIGHT,  
                        isOpen: 1  
                    });  
                    map.addControl(ctrlOve);  
  
                    //第6步：向地图中添加比例尺控件  
                    var ctrlSca = new window.BMap.ScaleControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_LEFT  
                    });  
                    map.addControl(ctrlSca);  
  
                    //第7步：绘制点    
                    for (var i = 0; i < markerArr.length; i++) {  
                        var p0 = markerArr[i].point.split(",")[0];  
                        var p1 = markerArr[i].point.split(",")[1];  
                        var maker = addMarker(new window.BMap.Point(p0, p1), i);  // i 标注字母顺序
                        addInfoWindow(maker, markerArr[i], i);   
                    }  
                }  
  
                // 添加标注  
                function addMarker(point, index) {  
                    var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png",  
                        new BMap.Size(23, 25), {  
                            offset: new BMap.Size(10, 25),  
                            imageOffset: new BMap.Size(0, 0 - index * 25)  
                        });  
                    var marker = new BMap.Marker(point, { icon: myIcon });  
                    map.addOverlay(marker);  
						//设置覆盖物的文字标签
						var label = new BMap.Label(markerArr[index].title,{offset:new BMap.Size(20,-10)});
						marker.setLabel(label);
						//end
                    return marker;  
                }  
  
                // 添加信息窗口  
                function addInfoWindow(marker, poi) {  
					
                    //pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + poi.title + '</div>';  
                    //pop弹窗信息  
                    var html = [];  
					
					html.push('<p style="vertical-align:top;line-height:16px">地址:'+poi.address+'</p><p style="vertical-align:top;line-height:16px">电话:'+poi.tel+'</p>');
                    /*html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + poi.address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + poi.tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');  */
                    var infoWindow = new BMap.InfoWindow(html.join(""), { title: title/*, width: 200*/ });  
  
                    var openInfoWinFun = function () {  
                        marker.openInfoWindow(infoWindow);  
                    };  
                    marker.addEventListener("click", openInfoWinFun);  
                    return openInfoWinFun;  
                }  
  
                //异步调用百度js  
                /*function map_load() {  
                    var load = document.createElement("script");  
                    load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
                    document.body.appendChild(load);  
                }  
                window.onload = map_load; */ 
				//点击打开标注点移动到标注点地图中心
				function getdddsnew(ln,la,title,address,tel){
				
					//pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + title + '</div>';  
                    //pop弹窗信息  
                    /*var html = [];  
                    html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');*/
					html='<p style="vertical-align:top;line-height:16px">地址:'+address+'</p><p style="vertical-align:top;line-height:16px">电话:'+tel+'</p>';
					
				
					//alert(lnat);
					//map.panTo(new BMap.Point(116.409, 39.918));平滑移动至新中心点 如果移动距离超过了当前地图区域大小，则地图会直跳到该点。
					var Point=new BMap.Point(ln,la);
					var opts = {    
					 //width : 250,     // 信息窗口宽度    
					 //height: 100,     // 信息窗口高度    
					 title : title  // 信息窗口标题   
					}    
					var infoWindow = new BMap.InfoWindow(html, opts);  // 创建信息窗口对象    
					//map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
					map.openInfoWindow(infoWindow, Point);
				}
				
				//map.panTo(new BMap.Point(116.409, 39.918));
            </script>

百度地图API示例百度地图API JavaScript API > 开发指南

查看文章跳到评论

广西南宁市 2016-11-02 17:49

#0

阅读 64万

百度地图显示多个标注点

广羽人优化后版本1
新增点击移动到标注点打开标注点信息窗口

<GZ:list sql="select * from gz_mendianbiaozhu where status='1' order by listorder desc" key='i'>

<?php
$meidanfenbu[]=$r;
?>
</GZ:list>
<!---------------------------------------- 栏目 start ---------------------------------------->
<div class="lanmu">
   <ul class="xuanxiang xuanxiangnew-lij clearfix"><include file="A:l"/>
   </ul>
</div>
<!---------------------------------------- 栏目 end ---------------------------------------->

<?php
	$zms=array(
		'1'=>'A',
		'2'=>'B',
		'3'=>'C',
		'4'=>'D',
		'5'=>'E',
		'6'=>'F',
		'7'=>'G',
		'8'=>'H',
		'9'=>'I',
		'10'=>'J',
		'11'=>'K',
		'12'=>'L',
		'13'=>'M',
		'14'=>'N',
		'15'=>'O',
		'16'=>'P',
		'17'=>'Q',
		'18'=>'R',
		'19'=>'S',
		'20'=>'T',
		'21'=>'U',
		'22'=>'V',
		'23'=>'W',
		'24'=>'X',
		'25'=>'Y',
		'26'=>'Z'
	);
?>

<!---------------------------------------- 门店分布内容 start ---------------------------------------->
<div class="mdfbbox">
   <div class="fbbt">广西南宁市范围广羽人门店分布地图：</div>
   <div class="gxditu" id="map" style="width:900px; height:365px; border:1px solid #ccc;"></div>
   <div class="fbbt" style="margin-top:30px;">广西南宁市广羽人所有店铺地址：</div>
   
   <div class="fbdzlf" style="width:900px;    border-right: none;"><?php
	foreach($meidanfenbu as $i=>$r){
	$ik++;
	if($nnssvs) $nnssvs.= ',{ title: "'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	else $nnssvs= '{ title: "名称：'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	$lns=explode(',',$r['zuobo']);
	$ln=$lns['0'];
	$la=$lns['1'];
   ?>
		  
		<div onclick="getdddsnew('{$ln}','{$la}','{$r.mingc}','{$r.dizhi}','{$r.tel}');" style="cursor: pointer;float:left;<?php
			if(($i%2)) echo 'width:425px;margin-left: 25px;';
			else echo 'width:448px;    border-right: 1px dashed #ccc;';
			//if($i>2) echo 'margin-top: 15px;';
		?>padding-bottom:15px;">
      <div style="width:100%;" class="dianming"><span style="color:red;"><?php echo $zms[$ik];?></span> {$r.mingc}</div>
      <P style="width:100%;" class="diandizhi" style="margin-bottom:15px;">{$r.dizhi}</P></div>
      <?php
	  }
	  
	  ?>
   </div>
   
  
</div>
<!---------------------------------------- 门店分布内容 end ---------------------------------------->


<script>
	var load = document.createElement("script");  
	load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
	document.body.appendChild(load); 

var markerArr = [ 
	<?php echo $nnssvs;?>
	//{ title: "名称：金外滩商务大厦", point: "108.33058,22.815521", address: "金外滩商务大厦1301"},
	//{ title: "名称：人民公园", point: "108.336858,22.83404", address: "人民公园地址<br>电话13607875450 "}
];  
  
                //var map; //Map实例  
				//map = new BMap.Map("map"); 
                function map_init() {  
                    map = new BMap.Map("map");
                    //第1步：设置地图中心点，南宁市政府  
                    var point = new BMap.Point(108.33058,22.815521);  
                    //第2步：初始化地图,设置中心点坐标和地图级别。  
                    map.centerAndZoom(point, 13);  
                    //第3步：启用滚轮放大缩小  
                    map.enableScrollWheelZoom(true);  
                    //第4步：向地图中添加缩放控件  
                    var ctrlNav = new window.BMap.NavigationControl({  
                        anchor: BMAP_ANCHOR_TOP_LEFT,  
                        type: BMAP_NAVIGATION_CONTROL_LARGE  
                    });  
                    map.addControl(ctrlNav);  
                    //第5步：向地图中添加缩略图控件  
                    var ctrlOve = new window.BMap.OverviewMapControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_RIGHT,  
                        isOpen: 1  
                    });  
                    map.addControl(ctrlOve);  
  
                    //第6步：向地图中添加比例尺控件  
                    var ctrlSca = new window.BMap.ScaleControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_LEFT  
                    });  
                    map.addControl(ctrlSca);  
  
                    //第7步：绘制点    
                    for (var i = 0; i < markerArr.length; i++) {  
                        var p0 = markerArr[i].point.split(",")[0];  
                        var p1 = markerArr[i].point.split(",")[1];  
                        var maker = addMarker(new window.BMap.Point(p0, p1), i);  // i 标注字母顺序
                        addInfoWindow(maker, markerArr[i], i);   
                    }  
                }  
  
                // 添加标注  
                function addMarker(point, index) {  
                    var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png",  
                        new BMap.Size(23, 25), {  
                            offset: new BMap.Size(10, 25),  
                            imageOffset: new BMap.Size(0, 0 - index * 25)  
                        });  
                    var marker = new BMap.Marker(point, { icon: myIcon });  
                    map.addOverlay(marker);  
                    return marker;  
                }  
  
                // 添加信息窗口  
                function addInfoWindow(marker, poi) {  
					
                    //pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + poi.title + '</div>';  
                    //pop弹窗信息  
                    var html = [];  
					
					html.push('<p style="vertical-align:top;line-height:16px">地址:'+poi.address+'</p><p style="vertical-align:top;line-height:16px">电话:'+poi.tel+'</p>');
                    /*html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + poi.address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + poi.tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');  */
                    var infoWindow = new BMap.InfoWindow(html.join(""), { title: title/*, width: 200*/ });  
  
                    var openInfoWinFun = function () {  
                        marker.openInfoWindow(infoWindow);  
                    };  
                    marker.addEventListener("click", openInfoWinFun);  
                    return openInfoWinFun;  
                }  
  
                //异步调用百度js  
                /*function map_load() {  
                    var load = document.createElement("script");  
                    load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
                    document.body.appendChild(load);  
                }  
                window.onload = map_load; */ 
				//点击打开标注点移动到标注点地图中心
				function getdddsnew(ln,la,title,address,tel){
				
					//pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + title + '</div>';  
                    //pop弹窗信息  
                    /*var html = [];  
                    html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');*/
					html='<p style="vertical-align:top;line-height:16px">地址:'+address+'</p><p style="vertical-align:top;line-height:16px">电话:'+tel+'</p>';
					
				
					//alert(lnat);
					//map.panTo(new BMap.Point(116.409, 39.918));平滑移动至新中心点 如果移动距离超过了当前地图区域大小，则地图会直跳到该点。
					var Point=new BMap.Point(ln,la);
					var opts = {    
					 //width : 250,     // 信息窗口宽度    
					 //height: 100,     // 信息窗口高度    
					 title : title  // 信息窗口标题   
					}    
					var infoWindow = new BMap.InfoWindow(html, opts);  // 创建信息窗口对象    
					//map.openInfoWindow(infoWindow, map.getCenter());      // 打开信息窗口
					map.openInfoWindow(infoWindow, Point);
				}
				
				//map.panTo(new BMap.Point(116.409, 39.918));
            </script>

查看文章跳到评论

广西南宁市 2016-11-02 15:44

#0

阅读 64万

百度地图显示多个标注点

关于百度地图api标注点marker的click事件问题

百度地图在地图中给标注点marker添加后click事件后

marker.addEventListener("click", function(){})
如何在其他地方自动触发这个marker点击事件？
因为输出marker是一个对象，所以并不能marker.click()
想做的就是如百度地图那样点击左边搜索结果栏右边标注点自动点击一次

感觉api确实不太好用，想出来俩解决方案。

1.可以定义好事件处理函数，想要触发时执行一遍：

marker.addEventListener('click',func);
function func(){
    alert();
}
// 想要触发时，直接调用func
func();

2.发现marker有一个属性B指向标记DOM，但B只在地图加载完成后才有值，否则为null，所以可以在地图加载完成后给给B绑定事件.

map.addEventListener("tilesloaded",function(){
    marker.B.addEventListener('click',function(){
        alert();
    });

    /* 使用zepto或jQuery
    $(marker.B).on('click',function(){
        alert();
    });
    */
});

// 注意触发时要保证地图加载完成
marker.B.click();
/* 或
$(marker.B).trigger('click');
*/

也可以不等地图加载完，定义marker后就直接绑定，但触发时还是触发marker.B也是可以的。

marker.addEventListener('click',function(){
    alert();
});

// 注意触发时要保证地图加载完成
marker.B.click();

查看文章跳到评论

广西南宁市 2016-11-02 15:43

#0

阅读 64万

百度地图显示多个标注点

<GZ:list sql="select * from gz_mendianbiaozhu where status='1' order by listorder desc" key='i'>

<?php
$meidanfenbu[]=$r;
?>
</GZ:list>
<!---------------------------------------- 栏目 start ---------------------------------------->
<div class="lanmu">
   <ul class="xuanxiang xuanxiangnew-lij clearfix"><include file="A:l"/>
   </ul>
</div>
<!---------------------------------------- 栏目 end ---------------------------------------->

<?php
	$zms=array(
		'1'=>'A',
		'2'=>'B',
		'3'=>'C',
		'4'=>'D',
		'5'=>'E',
		'6'=>'F',
		'7'=>'G',
		'8'=>'H',
		'9'=>'I',
		'10'=>'J',
		'11'=>'K',
		'12'=>'L',
		'13'=>'M',
		'14'=>'N',
		'15'=>'O',
		'16'=>'P',
		'17'=>'Q',
		'18'=>'R',
		'19'=>'S',
		'20'=>'T',
		'21'=>'U',
		'22'=>'V',
		'23'=>'W',
		'24'=>'X',
		'25'=>'Y',
		'26'=>'Z'
	);
?>

<!---------------------------------------- 门店分布内容 start ---------------------------------------->
<div class="mdfbbox">
   <div class="fbbt">广西南宁市范围广羽人门店分布地图：</div>
   <div class="gxditu" id="map" style="width:900px; height:365px; border:1px solid #ccc;"></div>
   <div class="fbbt" style="margin-top:30px;">广西南宁市广羽人所有店铺地址：</div>
   
   <div class="fbdzlf" style="width:900px;    border-right: none;"><?php
	foreach($meidanfenbu as $i=>$r){
	$ik++;
	if($nnssvs) $nnssvs.= ',{ title: "'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
	else $nnssvs= '{ title: "名称：'.$r['mingc'].'", point: "'.$r['zuobo'].'", address: "'.$r['dizhi'].'",tel:"'.$r['tel'].'"}';
   ?>
		  
		<div style="float:left;<?php
			if(($i%2)) echo 'width:425px;margin-left: 25px;';
			else echo 'width:448px;    border-right: 1px dashed #ccc;';
			//if($i>2) echo 'margin-top: 15px;';
		?>padding-bottom:15px;">
      <div style="width:100%;" class="dianming"><span style="color:red;"><?php echo $zms[$ik];?></span> {$r.mingc}</div>
      <P style="width:100%;" class="diandizhi" style="margin-bottom:15px;">{$r.dizhi}</P></div>
      <?php
	  }
	  
	  ?>
   </div>
   
  
</div>
<!---------------------------------------- 门店分布内容 end ---------------------------------------->


<script>

var markerArr = [ 
	<?php echo $nnssvs;?>
	//{ title: "名称：金外滩商务大厦", point: "108.33058,22.815521", address: "金外滩商务大厦1301"},
	//{ title: "名称：人民公园", point: "108.336858,22.83404", address: "人民公园地址<br>电话13607875450 "}
];  
  
                var map; //Map实例  
                function map_init() {  
                    map = new BMap.Map("map");  
                    //第1步：设置地图中心点，南宁市政府  
                    var point = new BMap.Point(108.33058,22.815521);  
                    //第2步：初始化地图,设置中心点坐标和地图级别。  
                    map.centerAndZoom(point, 13);  
                    //第3步：启用滚轮放大缩小  
                    map.enableScrollWheelZoom(true);  
                    //第4步：向地图中添加缩放控件  
                    var ctrlNav = new window.BMap.NavigationControl({  
                        anchor: BMAP_ANCHOR_TOP_LEFT,  
                        type: BMAP_NAVIGATION_CONTROL_LARGE  
                    });  
                    map.addControl(ctrlNav);  
                    //第5步：向地图中添加缩略图控件  
                    var ctrlOve = new window.BMap.OverviewMapControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_RIGHT,  
                        isOpen: 1  
                    });  
                    map.addControl(ctrlOve);  
  
                    //第6步：向地图中添加比例尺控件  
                    var ctrlSca = new window.BMap.ScaleControl({  
                        anchor: BMAP_ANCHOR_BOTTOM_LEFT  
                    });  
                    map.addControl(ctrlSca);  
  
                    //第7步：绘制点    
                    for (var i = 0; i < markerArr.length; i++) {  
                        var p0 = markerArr[i].point.split(",")[0];  
                        var p1 = markerArr[i].point.split(",")[1];  
                        var maker = addMarker(new window.BMap.Point(p0, p1), i);  
                        addInfoWindow(maker, markerArr[i], i);   
                    }  
                }  
  
                // 添加标注  
                function addMarker(point, index) {  
                    var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png",  
                        new BMap.Size(23, 25), {  
                            offset: new BMap.Size(10, 25),  
                            imageOffset: new BMap.Size(0, 0 - index * 25)  
                        });  
                    var marker = new BMap.Marker(point, { icon: myIcon });  
                    map.addOverlay(marker);  
                    return marker;  
                }  
  
                // 添加信息窗口  
                function addInfoWindow(marker, poi) {  
					
                    //pop弹窗标题  
                    var title = '<div style="font-weight:bold;color:#CE5521;font-size:14px">' + poi.title + '</div>';  
                    //pop弹窗信息  
                    var html = [];  
                    html.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>');  
                    html.push('<tr>');  
                    html.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">地址:</td>');  
                    html.push('<td style="vertical-align:top;line-height:16px">' + poi.address + ' </td>');
					html.push('</tr><tr><td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">电话:</td>');
					html.push('<td style="vertical-align:top;line-height:16px">' + poi.tel + ' </td>');					
                    html.push('</tr>');  
                    html.push('</tbody></table>');  
                    var infoWindow = new BMap.InfoWindow(html.join(""), { title: title, width: 200 });  
  
                    var openInfoWinFun = function () {  
                        marker.openInfoWindow(infoWindow);  
                    };  
                    marker.addEventListener("click", openInfoWinFun);  
                    return openInfoWinFun;  
                }  
  
                //异步调用百度js  
                function map_load() {  
                    var load = document.createElement("script");  
                    load.src = "http://api.map.baidu.com/api?v=1.4&callback=map_init";  
                    document.body.appendChild(load);  
                }  
                window.onload = map_load;  
				
				
				
				//map.panTo(new BMap.Point(116.409, 39.918));
            </script>

查看文章跳到评论

广西南宁市 2016-11-02 15:39

#0

阅读 64万

百度地图显示多个标注点

卧槽，一直没弄成多个自定义覆盖物，原来精髓在这里

var point = new Array();
var marker = new Array();
var info = new Array();

太感谢楼主了

查看文章跳到评论

广西南宁市 2016-11-02 15:26

#0

阅读 628.7万

他不是脾气暴躁，只是不能被打扰

老贾吹牛逼世界第一。

查看文章跳到评论

广西南宁市 2016-11-02 14:58

#0

阅读 628.7万

他不是脾气暴躁，只是不能被打扰

用户要什么给什么那是销售，告诉用户应该要什么才是营销。

查看文章跳到评论

广西南宁市 2016-11-02 14:55

#0

阅读 628.7万

他不是脾气暴躁，只是不能被打扰

甲之蜜糖，乙之砒霜。

查看文章跳到评论

lizhenqiu blog

最新评论聚合

常用html、demo代码

常用html、demo代码

他不是脾气暴躁，只是不能被打扰

简洁七牛图床图片上传外链源码

简洁七牛图床图片上传外链源码

简洁七牛图床图片上传外链源码

简洁七牛图床图片上传外链源码

简洁七牛图床图片上传外链源码

常用html、demo代码

他不是脾气暴躁，只是不能被打扰

百度地图显示多个标注点

百度地图显示多个标注点

百度地图显示多个标注点

百度地图显示多个标注点

百度地图显示多个标注点

百度地图显示多个标注点

百度地图显示多个标注点

他不是脾气暴躁，只是不能被打扰

他不是脾气暴躁，只是不能被打扰

他不是脾气暴躁，只是不能被打扰