一般的なフロントエンドテクノロジーの概要

1つの修正問題:

位置:修正済みの問題がIE6でサポートされていないことは誰もが知っています!しかし、私はこの属性を使用してフローティングメニューの特定の位置を修正することがよくあります。ただし、1つの問題は、この属性がIE6ではサポートされていないことです。ハック技術と表現を使って上記の問題を解決する方法があることがわかりました。IE6には修正されていないバグがたくさんあることは誰もが知っています。もちろん、Microsoftは現在IE6を修正できないため、インターネット研究の専門家がたくさんいます。もちろん、ハッキングもテクノロジーです。ハッキングについては考えないでください。もちろん、ハッキングせずに使用できます!修正ソリューションは次のとおりです。

 

* position:absolute; * top:expression(eval(documentElement.scrollTop + document.documentElement.offsetHeight-101))

コードの101は、フローティングメニューの高さを示しています。この場合、IE6はfix属性をサポートしていますが、スクロールバーを移動してテストすると、IE6と7にジッタのバグがあることがわかります。IE67のジッタを修正する方法は次のとおりです。

 

html、html body {background-p_w_picpath:url(about:blank); background-p_w_upload:fixed;}

以前は、この問題を解決するために1px×1pxの透明な画像をいくつか使用していましたが、可能な限り空の画像を配置できることがわかりました。現在、バグはありません。IE、Firefox、Googleなどのブラウザと互換性があります。

2半透明の問題を解決するには、cssにコードを1行追加するだけです。

 

背景色:#000; 不透明度:0.5;フィルター:アルファ(不透明度= 50);

3要素を覆う透明なフラッシュのためにIE67で要素をクリックできないという問題を解決するには、要素に次のコードを追加することで解決できます。

 

filter:alpha(opacity = 0); * background-color:#000; 位置:相対; z-index:1000;

4IE6でスクロールバーを使用してフローティングメニュースクロールのハックを解決します

 

width:100%!important; width:auto; / * navはIE6の下の中央に配置されます* / _ position:absolute; _top:expression(eval(documentElement.scrollTop + 130)); / *左側と右側* / _ position:absolute; bottom :0px; _top:expression(eval(documentElement.scrollTop + document.documentElement.offsetHeight-58));オーバーフロー:非表示;左:0.1%;マージン-左:10px;} / *下部* /

5 ul liの問題は、通常の状況ではこのようなものです。申し訳ありませんが、ここで写真を切り取ることはできず、説明することもできません。通常、1行に1行ですが、IE6 7では歪んでいるため、解決策を表示する必要があります。 :inline;この属性は問題を解決できます!

 6高さの問題コンテンツの増加に伴って要素の高さを増加させたい場合は、高さを100%に設定しないでください。この場合、コンテンツの増加に伴って背景が増加せず、中央で接触しなくなります。通常、高さは設定されません。しかし、高さが必要な場合:100%、上記の背景の問題を解決するために、次のコードを使用してそれを解決できます!

 

body、html {height:100%;}

 この場合、最外層の高さは本体とドキュメントの高さによって異なります。上記の問題は解決できます!

7 Taobao Wangwang Wangwangをクリックすると、特定のWangwangダイアログボックスがポップアップしてチャットできます。リンクを追加するだけです。

<a href = "http://amos.im.alisoft.com/msg.aw?v=2&uid=%E8%8B%BB%E8%8B%8F&site=cntaobao&s=1&charset=utf-8" target = "_ blank ">オンラインウォントウォント</a>このようなuid =%E8%8B%BB%E8%8B%8F uidの後には、encodeURIがエンコーディング変換に使用されている限り、特定のウォントウォント名が続きます。

8新浪微博分享代码<iframesrc = "http://vtsina.com.cn/widget/widget_topic_publish.php?tags=%E8%AF%9D%E9%A2%98%EF%BC%9A%E8% AF%B4%E5%87%BA%E4%BD%A0%E7%9A%84%E6%96%87%E5%85%B7%E6%9C%80%E7%88%B1%EF%BC% 9F&skin = 4&isShowPic = 1&width = 448&height = 103&wordLength =&mblogNum = 20 "class =" iframe2 "> </ iframe>

その中で、タグの後のものと&skinの前のものも、トピックをエンコードした後のものです。 

9 Taobao Weiboプラグインオンライン変換アドレスhttp://t.taobao.com/topic/admin/topicWidgetAdmin.htmただし、これを開くには、Ciscoの×××をインストールする必要があります。

10 Sina Weibo共有コード:

<a href = "javascript:(function(){window.open( 'http://vtsina.com.cn/share/share.php?title='+encodeURIComponent(' [有名な教師の講堂]質の高いコース、ブティックの講堂 ' )+ '&url =' + encodeURIComponent(location.href)+ '&source = bookmark'、 '_ blank'、 'width = 450、height = 400');})() "> </a>

淘江湖
    < ahref = "javascript:(function(){window.open( 'http://share.jianghu.taobao.com/share/addShare.htm?url='+encodeURIComponent(location.href)、' _ blank ');})() "> </a>

Renren
    <a href = "javascript:(function(){window.open( 'http://share.renren.com/share/buttonshare.do?link='+encodeURIComponent(location.href)+'&title = '+ encodeURIComponent(' [有名な教師の講堂]質の高いコース、ブティックの講堂 ')、' _blank ');})() "> </a>

豆瓣ر
    < ahref = "javascript:(function(){window.open( 'http://shuo.douban.com/!service/share?p_w_picpath=&href='+encodeURIComponent(location.href)、' _ blank ' );})() "> </a>

Kaixin.com
    <a href = "javascript:(function(){window.open( 'http://www.kaixin001.com/repaste/share.php?rtitle='+encodeURIComponent('【有名な教師講堂】質の高いコース、優秀レクチャーホール ')+'&rurl '+ encodeURIComponent(location.href)、' _blank ');})() "> </a>

QQ Weibo
 <a href = "javascript:(function(){window.open( 'http://s.jiathis.com/?webid=tqq&url='+encodeURIComponent(location.href)+'&title = '+ encodeURIComponent ( '[有名な教師の講堂]質の高いコース、優れた講堂')、 '_ blank');})() "> </a>

QQ空時間
 < ahref = "javascript:(function(){window.open( 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url='+encodeURIComponent(location.href)、 '_blank');})() "> </a>

MSN
 <a href = "javascript:(function(){window.open( 'http://mail.live.com/secure/start?action=compose&subject='+encodeURIComponent('【有名な先生の講堂】質の高いコース、ブティックの講堂'))+'&body = '+ encodeURIComponent(location.href)、' _blank ');})() "> </a>

谷歌バズ
 <ahref = "javascript:(function(){window.open( 'http://www.google.com/buzz/post?hl=zh-CN&url='+encodeURIComponent(location.href)、' _blank ');})() "> </a>

10 Youkuビデオアドレス変換:需要側がYoukuビデオアドレスを提供することがありますが、そのビデオアドレスには広告がありますが、需要側は広告が必要ないと言っているため、ここでの変換方法では、最初にYoukuビデオを開いて[詳細]をクリックします。 「マルチ」ボタンをクリックしてから、最初に次のようにフラッシュアドレスをコピーします。

http://player.youku.com/player.php/sid/XMzMyNTQ2MjA4/v.swf  このように変換するだけで、問題ありません http://player.youku.com/player.php/partnerid/XMTcxMg==/ sid / XMzMyNTQ2MjA4 /v.swf追加partnerid / XMTcxMg == 

11.アンカーリンクを使用する必要がある場合もありますが、アンカーリンクを使用できない場合もあります。javascriptを使用してjavascriptを記述できます。

<map name = "Map2" id = "Map2"> <area shape = "rect" coords = "16,60,148,104" href = "javascript:" onclick = "map( '#nav1')" target = "_ self" / > <area shape = "rect" coords = "15,107,147,151" href = "javascript:" onclick = "map( '#nav2')" target = "_ self" /> </ map>

  JS

 

<script type = "text / javascript"> function map(url){var _url = document.location.href、surl = _url.split( "#")、realUrl = surl [0] + url; location.href = realUrl; } </ script>

12天気予報をウェブページに追加する方法:

 

<iframe src = "http://m.weather.com.cn/m/pn12/weather.htm?id=101210101T" width = "245" height = "110" marginwidth = "0" marginheight = "0" hspace = "0" vspace = "0" frameborder = "0" scrolling = "no"> </ iframe>

効果は次のとおりです。

 

別の都市に変更したい場合は、番号101210101」を変更するだけです。アドレスバーのhttp://ah.weather.com.cn/?クリックすると、特定の異なる都市に対応する番号を検索できます。 URL:http//www.weather.com.cn/weather/101011000.shtmlその中の番号はです。

13 Tencent QQ qqボタンをクリックした後、TaobaoWangwangと直接チャットできます。次のようなコードを追加するだけです。

<ahref="tencent://message/?uin=807287699&Site=www.xnzjpc.com.cn&Menu=yes"title="クリックしてQQメッセージを送信">何かあったら、私に聞いてください</a>ここでuinはqq番号ですもちろん、お好きなQQ番号に変更することもできます!

14誰かにメールを送信するには:

<ahref="
                       mailto:[email protected] " target= " _parent " title= "给我件吧">メール<span>  [email protected] </ span> </a> 

15 javascript関数parseQueryStringを記述してください。その目的は、url = "http://www.baidu.com/index.php?key0=0&key1=1&key2=2"などのオブジェクトにurlを解析することです。

 

<script> function parseQueryString(url){var arr; var obj = {}; // alert(url); if((arr = url.indexOf( "?"))!=-1){var param = url.substring(arr + 1、url.length-1); console.log(param)// key0 = 0&key1 = 1&key2 = var paramArr = param.split( "&"); console.log(paramArr); // ["key = 0"、 'key = 1'、 'key =']; var ret = []; for(var i = 0; i <paramArr.length; i ++){ret = paramArr [i] .split( "="); console.log(ret); //console.log(ret[1]); obj [ret [0]] = ret [1]; console.log(obj [ret [0]] = ret [1]); }} return obj; } var url = "http://www.taobao.com/index.php?key0=0&key1=1&key2=2"; var obj = parseQueryString(url); console.log((obj.key0)); // 0 </ script>

16  IE8とIE9がハック  1.背景色を赤\ 0;両方IE8とIE9サポート。

background-color:#000; opacity:0.5; filter:alpha(opacity = 50);フロントエンド学習トレーニング、ビデオチュートリアル、学習ルート、プレステージkaixin666haoyunを追加


          2. background-color:blue \ 9 \ 0; IE9でのみサポートされています。


おすすめ

転載: blog.51cto.com/14895198/2562116