คำถามติดแท็ก jquery-animate

17
jQuery animate backgroundColor
ฉันพยายามทำให้เคลื่อนไหวใน backgroundColor โดยใช้ jQuery บน mouseover ฉันตรวจสอบตัวอย่างแล้วและดูเหมือนว่าถูกต้องมันใช้งานได้กับคุณสมบัติอื่น ๆ เช่น fontSize แต่ด้วย backgroundColor ฉันได้รับและข้อผิดพลาด "คุณสมบัติไม่ถูกต้อง" js องค์ประกอบที่ฉันกำลังทำงานคือ div $(".usercontent").mouseover(function() { $(this).animate({ backgroundColor: "olive" }, "slow"); }); ความคิดใด ๆ

6
แอนิเมชั่น addClass / removeClass ด้วย jQuery
ฉันใช้ jQuery และ jQuery-ui และต้องการเคลื่อนไหวคุณลักษณะต่าง ๆ บนวัตถุต่าง ๆ เพื่ออธิบายปัญหาที่นี่ฉันได้ทำให้มันง่ายขึ้นสำหรับ div หนึ่งที่เปลี่ยนจากสีน้ำเงินเป็นสีแดงเมื่อผู้ใช้เลื่อนเมาส์ไปที่มัน ฉันสามารถรับพฤติกรรมที่ฉันต้องการได้เมื่อใช้animate()อย่างไรก็ตามเมื่อทำเช่นนั้นสไตล์ที่ฉันเคลื่อนไหวต้องอยู่ในรหัสภาพเคลื่อนไหวและแยกจากสไตล์ชีตของฉัน (ดูตัวอย่างที่ 1 ) ทางเลือกที่จะใช้addClass()และแต่ฉันไม่ได้รับสามารถที่จะสร้างใหม่อีกครั้งพฤติกรรมที่แน่นอนว่าผมจะได้รับกับremoveClass() animate()(ดูตัวอย่างที่ 2 ) ตัวอย่างที่ 1 ลองดูรหัสที่ฉันมีanimate(): $('#someDiv') .mouseover(function(){ $(this).stop().animate( {backgroundColor:'blue'}, {duration:500}); }) .mouseout(function(){ $(this).stop().animate( {backgroundColor:'red'}, {duration:500}); }); มันแสดงพฤติกรรมทั้งหมดที่ฉันกำลังมองหา: เคลื่อนไหวได้อย่างราบรื่นระหว่างสีแดงและสีน้ำเงิน ไม่มีภาพเคลื่อนไหว 'overqueue-ing' เมื่อผู้ใช้เลื่อนเม้าส์เข้าและออกจาก div อย่างรวดเร็ว หากผู้ใช้เลื่อนเมาส์ออก / เข้าในขณะที่ภาพเคลื่อนไหวยังคงเล่นอยู่จะช่วยลดความถูกต้องระหว่างสถานะ 'ครึ่งทาง' ปัจจุบันและสถานะ 'เป้าหมาย' ใหม่ แต่เนื่องจากการเปลี่ยนแปลงสไตล์ถูกกำหนดไว้ในanimate()ฉันต้องเปลี่ยนค่าสไตล์ที่นั่นและไม่สามารถชี้ไปที่สไตล์ชีทของฉันได้ 'การแตกแฟรกเมนต์' ซึ่งสไตล์ถูกกำหนดเป็นสิ่งที่รบกวนจิตใจฉันอย่างแท้จริง …

21
องค์ประกอบเคลื่อนไหวถึงความสูงอัตโนมัติด้วย jQuery
ฉันต้องการให้เคลื่อนไหว<div>จาก200pxการautoสูง ฉันไม่สามารถทำงานได้ ไม่มีใครรู้ได้อย่างไร นี่คือรหัส: $("div:first").click(function(){ $("#first").animate({ height: "auto" }, 1000 ); });

11
jQuery .scrollTop (); + ภาพเคลื่อนไหว
ฉันตั้งค่าหน้าเว็บให้เลื่อนไปด้านบนเมื่อคลิกปุ่ม แต่ก่อนอื่นฉันใช้คำสั่ง if เพื่อดูว่าส่วนบนของหน้าไม่ได้ถูกตั้งค่าเป็น 0 จากนั้นถ้าไม่ใช่ 0 ฉันจะขยับหน้าเพื่อเลื่อนไปยังด้านบน var body = $("body"); var top = body.scrollTop() // Get position of the body if(top!=0) { body.animate({scrollTop:0}, '500'); } ส่วนที่ยุ่งยากตอนนี้กำลังเคลื่อนไหวอะไรบางอย่างหลังจากหน้าเลื่อนไปด้านบน ดังนั้นความคิดต่อไปของฉันคือค้นหาสิ่งที่ตำแหน่งหน้า ดังนั้นฉันใช้ console log เพื่อค้นหา console.log(top); // the result was 365 สิ่งนี้ทำให้ฉันได้ผลลัพธ์ 365 ฉันคาดเดาว่าเป็นอันดับที่ฉันอยู่ก่อนที่จะเลื่อนขึ้นไปด้านบน คำถามของฉันคือฉันจะกำหนดตำแหน่งเป็น 0 ได้อย่างไรเพื่อที่ฉันจะสามารถเพิ่มภาพเคลื่อนไหวอื่นที่ทำงานได้เมื่อหน้าอยู่ที่ 0 ขอบคุณ!

6
เลื่อนไปที่ ID ในการโหลดหน้า
ฉันกำลังพยายามทำให้การเลื่อนไปยัง ID เฉพาะในการโหลดหน้า ฉันได้ทำการวิจัยมากมายและเจอสิ่งนี้: $("html, body").animate({ scrollTop: $('#title1').height() }, 1000); แต่ดูเหมือนว่าจะเริ่มจาก ID และเคลื่อนไหวไปที่ด้านบนของหน้า? HTML (ซึ่งอยู่ครึ่งทางของหน้า) เป็นเพียง: <h2 id="title1">Title here</h2>
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.