tabラベルマウスの効果を細かく向上させるユーザー体験
tabラベルマウスの効果を細かく向上させるユーザー体験
Tabタグの切り替え効果はウェブページの中でほとんどどこにでもあるので、ウェブサイトを作るだけで、この効果があります.もちろん、私はどのようにそれを実現するかを話したいわけではありません(コードネット上で大きなものをつかむと、レベルがバラバラになります)
討論:Tab効果、切り替えを実現するのはマウスが切り替えたほうがいいですか?それともマウスがクリックして切り替えたほうがいいですか?
ユーザの使用の観点から言えば,少ない動作でより多くの情報を得ることができればよりよいが,マウスが通過するとマウスクリックよりも切り替えがよいといえる.附:今サイトにはこのようなラベルのようなものが非常に多く、迷うこともよくあります.デザインはラベルのように見えますが、クリックしてから直接新しいページを開いたり、ジャンプしたりします.これは閲覧者の意思ではないかもしれません.(これは私に多くのフォーラムを思い出させて、あるいはニュース、トップページのニュースの中で見たのは明らかにニュースのタイトルで、クリックしてから入ったのはニュースではありませんて、ニュースのコラムのトップページで、私にだまされた感じがします)だから効果のtabをクリックして、ユーザーだけが気にしないで彼をジャンプして肯定的にクリックします.
ユーザー体験の向上:マウスの通過効果が良い以上、どんな細かいところが向上しますか?
この問題といえば、やはりその日のお客様の要求は確かに細かいところだと感じました.ページはジュラシックソフトウェアのトップページです.http://www.jurassic.com.cn/彼の下にはtab切り替えの効果があります.この効果を見たとき、私はもちろんいつものやり方(具体的には言わない)ですぐにできます.効果はマウスを置いて切り替えることにほかならません.コードの上で、お客様がマウスをクリックする効果を要求した場合、mouseoverをclickに変更するだけで、中の実行コードは同じです.しかし、文句を言うお客様は突然、このTab効果の切り替えが速すぎて、マウスを勝手に引っ張って切り替えて、感度が高いと提案しました.心の中でひそかに取引先をののしるのは本当に事が多くて、しかし仕方なくやはり直して、切替コードを関数に书いて、更にsettimeoutで400ミリ秒遅らせて切替の関数を実现して、このステップを直して、感じは遅延して、しかしマウスはすべてのラベルを滑ってやはり切替して、ただ関数の実行を遅らせて、それを変えて、小さい问题!mouseoutにcleartimeoutを追加すると、ユーザーがTabラベルにマウスの滞在時間が400ミリ秒を超えないようにスライドすると、tabコンテンツの切り替えが起こらず、無意識のマウスのスライドによる切り替えが回避されます.変更後、お客様の要求は確かに正しいと感じています.わずかな一歩ですが、私がこんなに長い間やっていたTabの効果はすでに腐っていて、この問題に気づいたことがありません.多くの人がウェブサイトを閲覧する上で再びこれが処理しなければならない効果だと感じていないほど細かい(終わった後、いくつかのポータルと他のウェブサイトのTabの切り替えを見て、多くの切り替えが細かい遅延処理をしていることを発見して、以前はどうしてこの問題を発見していません).変更後、Tabラベルの上で、取引先はリンクを追加することを要求していないため、いっそ1つのクリック効果を追加して、完成した後にクリックして直接切り替えて、あるいはマウスはラベルの上で少し停止して内容を切り替えて、このようにユーザーの体験はとても良い昇格に達して、各種のユーザーの習慣を兼ねています.
後感後言
優れたコードはどのような条件を備えるべきか、以下のようにまとめるべきである(自分のいくつかの見方):1、互換性が強く、論理が合理的で、構造が最適化され、実行効率が高く、より多くの状況を考慮し、DOMアクセスを減らし、コードをできるだけ論理とカスタム操作に使用する(これはjsページスクリプト開発の特徴と関係がある).数行から数十行のコードを多く書くのは価値があります.2、読みやすさ、モジュール化、読みやすさとは、まず良いコード習慣、書く習慣、できるだけ必要なところに注釈の説明を残しておくことです.モジュール化されたコードは呼び出しやすく、同じ効果を避けることができます.対象のid、class、標署名名だけで繰り返し書くので、スクリプトライブラリの使用を推奨し、ライブラリは万能ではありません.しかし、ライブラリは、多くの理解されていない多くのステップを実装する必要があるコード、または不要な重複コードを簡略化しています.3、拡張能力が強く、今後予想できない修正が容易で、拡張とメンテナンスが容易で、これはコード構造の上で、最初からよく考えるべきで、もちろんこれは自身のレベルと経験と多くの関係がある.同様に、私は以上のいくつかの点もwebの標準的なページの書くことに適用すると思って、良いwebページのコードは十分にウェブサイトの構造の特徴を掌握すべきで、定義の様式あるいはhtmlコードの構造は全体から出発すべきで、現在のページだけを考慮して、現在のモジュール、往々にして私達は多くの繰り返しのコードを書くことができて、繰り返しの様式、最後に自分も混乱しました
Tabキーコードの表示
Tabタグの切り替え効果はウェブページの中でほとんどどこにでもあるので、ウェブサイトを作るだけで、この効果があります.もちろん、私はどのようにそれを実現するかを話したいわけではありません(コードネット上で大きなものをつかむと、レベルがバラバラになります)
討論:Tab効果、切り替えを実現するのはマウスが切り替えたほうがいいですか?それともマウスがクリックして切り替えたほうがいいですか?
ユーザの使用の観点から言えば,少ない動作でより多くの情報を得ることができればよりよいが,マウスが通過するとマウスクリックよりも切り替えがよいといえる.附:今サイトにはこのようなラベルのようなものが非常に多く、迷うこともよくあります.デザインはラベルのように見えますが、クリックしてから直接新しいページを開いたり、ジャンプしたりします.これは閲覧者の意思ではないかもしれません.(これは私に多くのフォーラムを思い出させて、あるいはニュース、トップページのニュースの中で見たのは明らかにニュースのタイトルで、クリックしてから入ったのはニュースではありませんて、ニュースのコラムのトップページで、私にだまされた感じがします)だから効果のtabをクリックして、ユーザーだけが気にしないで彼をジャンプして肯定的にクリックします.
ユーザー体験の向上:マウスの通過効果が良い以上、どんな細かいところが向上しますか?
この問題といえば、やはりその日のお客様の要求は確かに細かいところだと感じました.ページはジュラシックソフトウェアのトップページです.http://www.jurassic.com.cn/彼の下にはtab切り替えの効果があります.この効果を見たとき、私はもちろんいつものやり方(具体的には言わない)ですぐにできます.効果はマウスを置いて切り替えることにほかならません.コードの上で、お客様がマウスをクリックする効果を要求した場合、mouseoverをclickに変更するだけで、中の実行コードは同じです.しかし、文句を言うお客様は突然、このTab効果の切り替えが速すぎて、マウスを勝手に引っ張って切り替えて、感度が高いと提案しました.心の中でひそかに取引先をののしるのは本当に事が多くて、しかし仕方なくやはり直して、切替コードを関数に书いて、更にsettimeoutで400ミリ秒遅らせて切替の関数を実现して、このステップを直して、感じは遅延して、しかしマウスはすべてのラベルを滑ってやはり切替して、ただ関数の実行を遅らせて、それを変えて、小さい问题!mouseoutにcleartimeoutを追加すると、ユーザーがTabラベルにマウスの滞在時間が400ミリ秒を超えないようにスライドすると、tabコンテンツの切り替えが起こらず、無意識のマウスのスライドによる切り替えが回避されます.変更後、お客様の要求は確かに正しいと感じています.わずかな一歩ですが、私がこんなに長い間やっていたTabの効果はすでに腐っていて、この問題に気づいたことがありません.多くの人がウェブサイトを閲覧する上で再びこれが処理しなければならない効果だと感じていないほど細かい(終わった後、いくつかのポータルと他のウェブサイトのTabの切り替えを見て、多くの切り替えが細かい遅延処理をしていることを発見して、以前はどうしてこの問題を発見していません).変更後、Tabラベルの上で、取引先はリンクを追加することを要求していないため、いっそ1つのクリック効果を追加して、完成した後にクリックして直接切り替えて、あるいはマウスはラベルの上で少し停止して内容を切り替えて、このようにユーザーの体験はとても良い昇格に達して、各種のユーザーの習慣を兼ねています.
後感後言
優れたコードはどのような条件を備えるべきか、以下のようにまとめるべきである(自分のいくつかの見方):1、互換性が強く、論理が合理的で、構造が最適化され、実行効率が高く、より多くの状況を考慮し、DOMアクセスを減らし、コードをできるだけ論理とカスタム操作に使用する(これはjsページスクリプト開発の特徴と関係がある).数行から数十行のコードを多く書くのは価値があります.2、読みやすさ、モジュール化、読みやすさとは、まず良いコード習慣、書く習慣、できるだけ必要なところに注釈の説明を残しておくことです.モジュール化されたコードは呼び出しやすく、同じ効果を避けることができます.対象のid、class、標署名名だけで繰り返し書くので、スクリプトライブラリの使用を推奨し、ライブラリは万能ではありません.しかし、ライブラリは、多くの理解されていない多くのステップを実装する必要があるコード、または不要な重複コードを簡略化しています.3、拡張能力が強く、今後予想できない修正が容易で、拡張とメンテナンスが容易で、これはコード構造の上で、最初からよく考えるべきで、もちろんこれは自身のレベルと経験と多くの関係がある.同様に、私は以上のいくつかの点もwebの標準的なページの書くことに適用すると思って、良いwebページのコードは十分にウェブサイトの構造の特徴を掌握すべきで、定義の様式あるいはhtmlコードの構造は全体から出発すべきで、現在のページだけを考慮して、現在のモジュール、往々にして私達は多くの繰り返しのコードを書くことができて、繰り返しの様式、最後に自分も混乱しました
Tabキーコードの表示
function tabChange(tabHead,headAddClass,tabBox,boxAddClass){
var timeout;
function eachClass(){
jQuery(tabHead).each(function(i){
jQuery(tabHead).eq(i).removeClass(headAddClass);
jQuery(tabBox).eq(i).removeClass(boxAddClass);
});
}
window.addClass = function(a){
eachClass();
jQuery(tabHead).eq(a).addClass(headAddClass);
jQuery(tabBox).eq(a).addClass(boxAddClass);
}
jQuery(tabHead).each(function(i){
jQuery(tabHead).eq(i).mouseover(function(){
timeout =setTimeout("addClass("+i+")", 400);
});
jQuery(tabHead).eq(i).mouseout(function(){
clearTimeout(timeout);
});
jQuery(tabHead).eq(i).click(function(){
addClass(i);
return false;
});
});