jQuery ప్రభావాలు

  • ముందు పేజీ
  • తరువాత పేజీ

jQuery సింహావిషయాలను స్పష్టంగా చూపించగలదు, అనేక ప్రభావాలను సృష్టించగలదు మరియు అనుకూలీకరించగలదు.

亲自试一试

ఈ jQuery ప్రభావాన్ని ప్రయత్నించండి:

CodeW3C.com - ప్రముఖ వెబ్ టెక్నాలజీ శిక్షణ స్టేషన్

CodeW3C.com లో, మీకు అవసరమైన అన్ని వెబ్ సైట్ నిర్మాణ శిక్షణలను కనుగొనవచ్చు.

ఇక్కడ క్లిక్ చేయండి

ఉదాహరణ

jQuery hide()
సాధారణ jQuery hide() ఫంక్షన్ను ప్రదర్శించండి.
jQuery hide()
మరొక hide() ప్రదర్శన. పాక్షిక టెక్స్ట్ను ఎలా పరిమితం చేయాలి.
jQuery slideToggle()
సాధారణ slide panel ప్రభావాన్ని ప్రదర్శించండి.
jQuery fadeTo()
సాధారణ jQuery fadeTo() ఫంక్షన్ను ప్రదర్శించండి.
jQuery animate()
సాధారణ jQuery animate() ఫంక్షన్ను ప్రదర్శించండి.

jQuery పరిమితి మరియు ప్రదర్శించడం

hide() మరియు show() ఫంక్షన్ల ద్వారా, jQuery HTML కెలిపి పెట్టడం మరియు ప్రదర్శించడానికి మద్దతిస్తుంది:

ఉదాహరణ

$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});

亲自试一试

hide() మరియు show() ఫంక్షన్లు speed మరియు callback రెండు ఆప్షనల్ పరామీతులను సెట్ చేయవచ్చు.

సంకేతం ఉంది:

$(selector).hide(speed,callback)
$(selector).show(speed,callback)

speed పరామీతులు ప్రదర్శించడం లేదా పరిమితిని పెట్టడానికి ఉపయోగిస్తారు. ఈ విలువలను నిర్ణయించవచ్చు: "slow", "fast", "normal" లేదా మిల్లీసెకండ్లు.

callback పరామీతులు హైడ్ లేదా షో ఫంక్షన్లు పూర్తి అయిన తర్వాత అమల్లోకి వస్తుంది. ఈ పాఠ్యం కింది చివరలో మరిన్ని అనుబంధ పాఠాలను నేను నేర్చుకుంటాను callback పారామీటర్ల గ్రహణం.

ఉదాహరణ

$("button").click(function(){
$("p").hide(1000);
});

亲自试一试

jQuery తిరిగి పెట్టు ఫంక్షన్

jQuery toggle() ఫంక్షన్ show() లేదా hide() ఫంక్షన్లను వాడి హైలైట్ హెడ్ అనుకూలంగా చేస్తుంది.

ప్రదర్శించబడుతున్న కెలిపి పెట్టి, పెట్టబడుతున్న కెలిపి ప్రదర్శించు.

సంకేతం ఉంది:

$(selector).toggle(speed,callback)

speed పారామీటర్లు ఈ విలువలను సెట్ చేయవచ్చు: "slow", "fast", "normal" లేదా మిల్లీసెకన్లు.

ఉదాహరణ

$("button").click(function(){
$("p").toggle();
});

亲自试一试

callback పారామీటర్ అనేది ఈ ఫంక్షన్ పూర్తి అయిన తర్వాత అమల్లోకి వస్తున్న ఫంక్షన్ పేరు. ఈ శిక్షణలో క్రింది భాగాలలో మరింత గురించి తెలుసుకోండి అని నేను నేర్పుతాను callback పారామీటర్ల గ్రహణం.

jQuery స్లైడ్ ఫంక్షన్లు - slideDown, slideUp, slideToggle

jQuery కింద ఈ స్లైడ్ ఫంక్షన్లు ఉన్నాయి:

$(selector).slideDown(speed,callback)
$(selector).slideUp(speed,callback)
$(selector).slideToggle(speed,callback)

speed పారామీటర్లు ఈ విలువలను సెట్ చేయవచ్చు: "slow", "fast", "normal" లేదా మిల్లీసెకన్లు.

callback పారామీటర్ అనేది ఈ ఫంక్షన్ పూర్తి అయిన తర్వాత అమల్లోకి వస్తున్న ఫంక్షన్ పేరు. ఈ శిక్షణలో క్రింది భాగాలలో మరింత గురించి తెలుసుకోండి అని నేను నేర్పుతాను callback పారామీటర్ల గ్రహణం.

slideDown() ఉదాహరణ

$(".flip").click(function(){
$(".panel").slideDown();
});

亲自试一试

slideUp() ఉదాహరణ

$(".flip").click(function(){
$(".panel").slideUp();
});

亲自试一试

slideToggle() ఉదాహరణ

$(".flip").click(function(){
$(".panel").slideToggle();
});

亲自试一试

jQuery Fade ఫంక్షన్లు - fadeIn(), fadeOut(), fadeTo()

jQuery కింద ఈ fade ఫంక్షన్లు ఉన్నాయి:

$(selector).fadeIn(speed,callback)
$(selector).fadeOut(speed,callback)
$(selector).fadeTo(speed,opacity,callback)

speed పారామీటర్లు ఈ విలువలను సెట్ చేయవచ్చు: "slow", "fast", "normal" లేదా మిల్లీసెకన్లు.

fadeTo() ఫంక్షన్‌లో opacity పారామీటర్ అనేది ఇచ్చిన అనుప్రయోగం స్పష్టతను తగ్గించే పారామీటర్ ఉంది.

callback పారామీటర్ అనేది ఈ ఫంక్షన్ పూర్తి అయిన తర్వాత అమల్లోకి వస్తున్న ఫంక్షన్ పేరు. ఈ శిక్షణలో క్రింది భాగాలలో మరింత గురించి తెలుసుకోండి అని నేను నేర్పుతాను callback పారామీటర్ల గ్రహణం.

fadeTo() ఉదాహరణ

$("button").click(function(){
$("div").fadeTo("slow",0.25);
});

亲自试一试

fadeOut() ఉదాహరణ

$("button").click(function(){
$("div").fadeOut(4000);
});

亲自试一试

jQuery స్వంత అనిమేషన్

jQuery ఫంక్షన్ స్వంత అనిమేషన్‌ను సృష్టించే సింథెక్స్:

$(selector).animate({params},[duration],[easing],[callback])

కీలక పారామీటర్ ఉంది paramsఇది అనిమేషన్‌కు రూపకల్పన చేసే CSS అంశాలను నిర్వచిస్తుంది. ఈ విధమైన అనేక అంశాలను సమాంతరంగా సెట్ చేయవచ్చు:

animate({width:"70%",opacity:0.4,marginLeft:"0.6in",fontSize:"3em"});

రెండవ పారామీటర్ ఉంది durationఇది అనిమేషన్‌కు వర్తించే సమయాన్ని నిర్వచిస్తుంది. అది సెట్ చేసిన విలువలు: "slow", "fast", "normal" లేదా మిల్లీసెకన్లు.

实例 1

亲自试一试

实例 2

亲自试一试

HTML 元素默认是静态定位，且无法移动。

如需使元素可以移动，请把 CSS 的 position 设置为 relative 或 absolute。

jQuery 效果 - 来自本页

函数 描述
$(selector).hide() 隐藏被选元素
$(selector).show() 显示被选元素
$(selector).toggle() 切换（在隐藏与显示之间）被选元素
$(selector).slideDown() 向下滑动（显示）被选元素
$(selector).slideUp() 向上滑动（隐藏）被选元素
$(selector).slideToggle() ఎంపికచేసిన ఎలిమెంట్ని వెళుతున్నది మరియు తిరిగి వచ్చేది మధ్య స్లైడ్ చేయండి
$(selector).fadeIn() ఎంపికచేసిన ఎలిమెంట్ని అనుకూలంగా కాలింగను ప్రసారం చేయండి
$(selector).fadeOut() ఎంపికచేసిన ఎలిమెంట్ని పరిమాణం తీసివేసి కాలింగను ప్రసారం చేయండి
$(selector).fadeTo() ఎంపికచేసిన ఎలిమెంట్ని పరిమాణం తీసివేసి అనుకూలంగా కాలింగను ప్రసారం చేయండి
$(selector).animate() ఎంపికచేసిన ఎలిమెంట్లపై అనుకూలంగా ఆనిమేషన్ నిర్వహించండి

పూర్తి పరిశీలన హాండ్బుక్ కోసం మా jQuery ప్రభావం పరిశీలన హాండ్బుక్。

  • ముందు పేజీ
  • తరువాత పేజీ