DIY シミュレーションモーダルダイアログボックスの実装コード_JavaScript スキル

コードをコピー コードは次のとおりです: 無标题文档 选择经度: document.getElementById("txtSelect").onfocus=function(){ var windows = document.getElementById("window"); var title = document.getElementById("title"); varlayer = document.getElementById("layer"); if(windows==null&&layer==null&&title==null){ var style = document.createElement("style"); style.type="text/css"; document.body.appendChild(style); var styleText = "#layer{ width:100%;height:100%;background:#000000;position:absolute;z-index:100;left:0;top:0;filter:alpha(opacity=40 ); 不透明度:0.4}"; styleText ="#window{position:absolute; z-index:1000;background:#ffc;}"; styleText ="#title{ background:#CCFFFF;width:100%;height:15%;font-size:2em;font-weight:bold; text-align:left; line-height:1.5em }" styleText ="#content{ 高さ:85%;幅:100%;背景:#CCCCCC}"; styleText ="#frame{ 幅:100%;高さ:100%;} #map{ 幅:100%;高さ:100%}"; 試してください{ if(typeof style.styleSheet.cssText!="未定義"){ style.styleSheet.cssText=styleText; } }catch(ex){ style.appendChild(document.createTextNode(styleText)); } varlayer = document.createElement("div"); document.body.appendChild(layer); layer.id="レイヤー"; var windows = document.createElement("div"); document.body.appendChild(windows); windows.id="ウィンドウ"; windows.style.height="400px"; windows.style.width = "600px"; var height = parseInt(windows.style.height); var width = parseInt(windows.style.width); windows.style.top = parseInt(document.documentElement.clientHeight/2-height/2) "px"; windows.style.left = parseInt(document.documentElement.clientWidth/2-width/2) "px"; var title = document.createElement("div"); windows.appendChild(title); title.id="タイトル"; title.appendChild(document.createTextNode("点此关闭")); var content = document.createElement("div"); windows.appendChild(コンテンツ); content.id="コンテンツ"; var map = document.getElementById("map"); content.appendChild(map); map.style.display="ブロック"; if(typeoflayer.style.opacity!="unknown"){ layer.style.opacity=0.5; } else if(typeoflayer.style.filter!="未定義"){ layer.style.filter="alpha(opacity=50)"; } } else{ if(typeoflayer.style.opacity!="unknown"){ layer.style.opacity=0.5; } else if(typeoflayer.style.filter!="未定義"){ layer.style.filter="alpha(opacity=50)"; } layer.style.zIndex=100; windows.style.zIndex=1000; layer.style.display="ブロック"; windows.style.display="ブロック"; } layer.onclick = title.onclick = function(){ windows.style.zIndex=-1000; windows.style.display="none"; //让层渐隐 var timer = setTimeout(displayLayer,200); function displayLayer(){ if(typeoflayer.style.opacity!="unknown"){ varlayers = document.getElementById("layer"); var opacity = parseFloat(layers.style.opacity); 不透明度 = 不透明度-0.1; if(opacity>0){ setTimeout(arguments.callee,100); } else if(opacitylayers.style.zIndex=-100; clearTimeout(タイマー); } layers.style.opacity = 不透明度; } else if(typeoflayer.style.filter!="unknown"){ varlayers = document.getElementById("layer"); var filterStyle =layers.style.filter; //opacity = parseInt(filterStyle.substring(filterStyle.indexOf("=") 1)); var opacity = parseInt(filterStyle.match(/d /)); 不透明度 = 不透明度-10; if(opacity>0){ setTimeout(arguments.callee,100); } else if(opacitylayers.style.zIndex=-100; clearTimeout(タイマー); } layers.style.filter = "alpha(opacity=" opacity ")"; } else{ throw new Error("ブラウザのバージョンが低いです!"); } } document.getElementById("txtSelect").value=frames["map"].document.getElementById("hidden").value; } } window.onunload=function(){ var windows = document.getElementById("window"); var title = document.getElementById("title"); var Layer = document.getElementById ("layer"); layer.onclick = windows.onclick=null; // イベントバインディングをクリア document.body.removeChild(title); .body.removeChild(windows); } これは百度地図の座標を示すページです コードをコピーします Baidu Map varmap("コンテナ"); >map.centerAndZoom(new BMap.Point(104.105, 30.624), 6); map.addControl(new BMap.NavigationControl()) //Navigation map.addControl(new BMap.ScaleControl()); ; map.addControl(new BMap.OverviewMapControl()); map.addEventListener("click", function (e) { document.getElementById("hidden").value = e.point. lng ", " e.point.lat; }); var localSearch = new BMap.LocalSearch(map, { renderOptions: { pageCapacity: 8, autoViewport: true, selectFirstResult: false } }); localSearch.enableAutoViewport(); function searchByStationName(name) { var キーワード = name; (searchResult) { var poi = searchResult.getPoi(0); alert(poi.point.lng " " poi.point.lat); document.getElementById("hidden").value = e.point .lng "," e.point.lat; map.centerAndZoom(poi.point, 8)); localSearch.search(キーワード); >

DIY シミュレーション モーダル ダイアログ ボックスの実装コード_JavaScript スキル

関連記事

DIY シミュレーションモーダルダイアログボックスの実装コード_JavaScript スキル