jquery 視覺特效（新聞滾動瀏覽）

效果描述：

讓文字形式新聞，顯示給訪問站點的人看。讓新聞在乙個不可見視窗中往上滾動，當新聞全部滾動到上面消失之後，在視窗底部重新出現，並繼續向上滾動。

html:

div

id="scroller"

據南韓《朝鮮**》10月6**道，美國國會在上月出版的乙份報告中證實，美國在中日存在主權糾紛的釣魚島問題上，只承認日本的「行政權」，而非承認日本對其擁有「主權」。

據報道，美國國會調查局（crs）將2023年報告修改後，於上月末重新出版了乙份題為《釣魚島糾紛：美國條約的義務》的報告。該報告顯示，美國**委託國會批准2023年與日本簽署的《返還沖繩協議》時表示：「將釣魚島行政權轉交給日本，並不意味著對該島嶼的主權主張有任何傾向。」也就是說，美國當時雖然將二戰停戰後負責管理的釣魚島返還給日本**，但對於中日兩國對釣魚島的主權主張持「中立態度」。

針對美國國會提出的「《返還沖繩協議》是否會影響釣魚島主權」這一問題，美國時任國務卿威廉-羅傑斯當時也曾回答說：「對這些島嶼的法律地位（主權）沒有任何影響。」

另外，美國*****法律顧問羅伯特-斯塔爾也曾表示：「美國不能擴大日本移交給我們（美國）之前它曾對釣魚島擁有的法律權利，現在將其返還，也不能縮小其他主張主權國家的權利。」報道說，這表明，美國不會對主權糾紛產生任何影響，且將對該問題保持距離。

不過，這一報告也指出：「美國雖然在釣魚島主權問題上持中立態度，但《美日安保條約》的適用物件確實包括釣魚島。」因為《美日安保條約》規定其適用物件為「日本擁有行政權的地區」。　

div>

css：

#scroller#scroller p

jquery：

$(document).ready(function());
//p的高度
p_height =$scroller.height();
//整個p文字向上移動的高度需要多加上一些距離，才能讓最後一行文字完全消失後再重新出現。這裡我給了乙個25
p_move_height=p_height+25
;    
var animator =function(imgblock),
10000
,        function());
animator(imgblock);
}             );}
animator($scroller);
});

上面的效果是使用jquery的animate()方法實現的。也可以使用css()方法實現。其**如下：

$(document).ready(function());
//scroller的高度 
//p的高度
p_height =$scroller.height();
//設定初始向上滾動的距離
move_lines = 0
;    
scroll();
});function scroll());
//如果move_lines的小於負數的文字p的高度
if(move_lines<-1*p_height)
settimeout(scroll,
50);
}

如果我現在想為上面的css()方法滾動的效果增加滑鼠懸停功能呢？

實現**如下：

$(document).ready(function());
//scroller的高度 
//p的高度
p_height =$scroller.height();
//設定初始向上滾動的距離
move_lines = 0
;    
//設定滾動初始值為true
rolling = true
;    function(),function()
);    scroll();
});function scroll());
//如果move_lines的小於負數的文字p的高度
if(move_lines<-1*p_height)
settimeout(scroll,
50);
}

最終效果，拷貝複製即可看到。

jquery 視覺特效（新聞滾動瀏覽）

jquery 視覺特效（幻燈片左右移動）

jQuery特效動畫

jQuery 動畫與特效

jquery 視覺特效（新聞滾動瀏覽）

jquery 視覺特效（幻燈片左右移動）

jQuery特效動畫

jQuery 動畫與特效

相關推薦