コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > Web ページの右側にある中断されたスクロール オンライン QQ カスタマー サービスのコード例_JavaScript スキル

Web ページの右側にある中断されたスクロール オンライン QQ カスタマー サービスのコード例_JavaScript スキル

WBOY
リリース： 2016-05-16 16:50:53
オリジナル
1577 人が閲覧しました

Web ページの右側にある QQ オンライン カスタマー サービス コードのスクロールが一時停止されました

Web ページの右側にある中断されたスクロール オンライン QQ カスタマー サービスのコード例_JavaScript スキル

コードをコピー コードは次のとおりです:

function myEvent(obj,ev,fn){
if (obj.attachEvent){
obj.attachEvent('on' ev,fn);
}else{
obj.addEventListener(ev,fn,false);
};
};
function getbyClass(id,sClass){
var oParent = document.getElementById(id);
var all = oParent.getElementsByTagName('*');
var array = [];
for (var i=0; i if (all[i].className = = sClass){
array.push(all[i]);
};
};
return array;
};
function getStyle(obj,name){
if(obj.currentStyle){
return obj.currentStyle[name];
}else{
return getComputedStyle(obj,false)[name];
};
};
function Running(obj,json,fnEnd){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var now=0;
var bStop= true;
for (json の var attr){
if(attr=='opacity'){
now=Math.round(parseFloat(getStyle(obj,attr))*100);
}else{
now=parseInt(getStyle(obj,attr));
};
varspeed=(json[attr]-now)/5;
speed=speed>0? Math.ceil(speed):Math.floor(speed);
if(now!=json[attr])bStop=false;
if(attr=='opacity'){
obj.style .filter='alpha(opacity:' 現在の速度 ')';
obj.style.opacity=(現在の速度)/100;
}else{
obj.style[attr]=現在の速度 ' px';
};
}
if(bStop){
clearInterval(obj.timer);
if(fnEnd)fnEnd();
}
}, 30);
}
function Flexing(obj,json,fnEnd){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var now=0 ;
var bStop=true;
for (json の var attr){
if(!obj.speed)obj.speed={};
if(!obj.speed[attr]) obj.speed[attr]=0;
now=parseInt(getStyle(obj,attr));
if(Math.abs(json[attr]-now)>1 || Math.abs(obj.speed[attr])>1){
bStop=false;
obj.speed[attr] =(json[attr]-now)/5;
obj.speed [attr]*=0.85;
var MaxSpeed=65;
if(Math.abs(obj.speed[attr])>MaxSpeed){
obj.speed[attr]=obj.speed[ attr]>0?MaxSpeed:-MaxSpeed;
};
obj.style[attr]=now obj.speed[attr] 'px';
};
};
if(bStop){
clearInterval(obj.timer);
obj.style[attr]=json[attr] 'px';
if(fnEnd)fnEnd();
};
}, 30);
}
function setqq(obj,num){
if (obj.length!=num.length){
alert('nspan の数と QQ 番号的数不符，请設置5个QQ番号!nn[設置未成功!]');
return;
}else{
for (var i=0; i obj[i].innerHTML = "点击咨询";
};
};
};
function settop(id,id2,top){
var obj = document.getElementById( id);
var box = document.getElementById(id2);
obj.style.top = box.style.top = top 'px';
};
function dealy(id,time ){
var obj = document.getElementById(id);
var timer = setTimeout(function(){
Flexing(obj,{right:-100});
},time*1000 );
};
function click_fn(id,id2){
var obj = document.getElementById(id);
var box = document.getElementById(id2);
obj.onclick = function(){
Running(obj,{right:-200},function(){
box.style.display = 'block';
Running(box,{right:10, opacity: 100});     
});
};
box.onclick = function(){
timer = setTimeout(function(){
Running(box,{right:-220,opacity:0} ,function(){
box.style.display = 'none';
Flexing(obj,{right:-100});
});
},3000);
};
};
関連ラベル：
右にフロート
ソース：php.cn
前の記事：テキスト ボックスが focus_javascript テクニックになったときにテキスト ボックスの内容をクリアする 次の記事：JSで2つの大きな数値(整数)の乗算を実装_JavaScriptスキル
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
width プロパティを追加してコンテンツを左に移動します。 ボディに余白を設けました。 main {left margin: 200px; right margin: 200px; textalignment: center} テキストを1...
から 2024-04-06 22:01:35
0
3
816
CSS でフローティング要素を水平ではなく垂直にスタックするにはどうすればよいですか? 片側にメインコンテンツ、もう一方に追加コンテンツがある 2 つの列を持つ Web ページを作成しようとしています。ただし、float プロパティを使用して追加の列を左に揃えているた...
から 2024-04-06 20:45:26
0
2
386
DIV を両側のコンテンツに合わせて中央揃えにします したがって、(含まれる DIV 内に) 5 つの項目があります。項目の並びは以下の通りです。 テキスト 画像 DIV 画像 テキスト DIVを中心にして画像がDIVを「抱き締める」...
から 2024-04-04 23:19:14
0
1
3438
Symfony 5 のカスタムデフォルト利用規約チェックボックス 私は symfony を初めて使用するので、登録ページを構築しようとしています。フォームとフィールドは FormType を通じて生成されますが、利用規約チェックボックスの外観を変...
から 2024-04-04 22:42:19
0
1
1365
クリックしたときにテキストが新しい要素 (区切り線など) に変わるようにするにはどうすればよいですか? ページ上の特定のテキストをクリックすると区切り文字/新しい要素に変わる方法を見つけようとしています。どう説明したらいいのかわかりませんが、画像の下にタイトルがあると想像してください...
から 2024-04-04 11:21:03
0
1
3580
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート