jQuery onClick परिवर्तन 'शीर्ष' विशेषता

Question

मैं jQuery का उपयोग कर एक खड़ी स्क्रोलर बनाने के लिए कोशिश कर रहा हूँ और मैं अपने कोड के साथ मुसीबतों हो रहा है ..

function scrolldown() {  
    var newtop = $('.scroll-content').css('top') + '250'; 
    $('.scroll-content').css({top: newtop}); 
} 

सीएसएस:

.scroll-content {position:absolute; top:0px} 

साथ कोई समस्या नहीं सीएसएस मैं फायरबग में मूल्य बदल सकता हूं और ठीक काम करता है, लेकिन कोड मुद्दा है। मैं इसे वर्तमान मूल्य में 250px जोड़ना चाहता हूं लेकिन यह काम नहीं करता है और .html(newtop) का उपयोग करते समय मैं देख सकता हूं कि "शीर्ष" मान का आउटपुट 0px250 है ... कोई विचार क्या मैं गलत कर रहा हूं?

Answer 1

$('.scroll-content').css('top') 

"123px" है, जो एक स्ट्रिंग है ("पिक्सल" की वजह से) की तरह कुछ वापस आ जाएगी। आप "250" जोड़ते हैं तो आपको "123px250" है, जो नहीं है कि आप क्या चाहते ...

बजाय इस एक का प्रयास करें:

var newtop = $('.scroll-content').position().top + 250; 
$('.scroll-content').css('top', newtop + 'px'); 

Answer 2

करें कि आप अपने शीर्ष मूल्य के लिए एक पूर्णांक जोड़ रहे हैं बनाओ एक स्ट्रिंग नहीं। नीचे देखें:

var newtop = $('.scroll-content').css('top') + 250; 
    $('.scroll-content').css({top: newtop}); } 

Answer 3

आप किसी पूर्णांक (0) में सीएसएस स्ट्रिंग ('0px') में बदलने की आवश्यकता है ताकि आप 250 जोड़ सकते हैं, तो एक के रूप में 'पिक्सल' फिर से

function scrolldown() { 
    var newtop = parseInt($('.scroll-content').css('top')) + 250; 
    $('.scroll-content').css({top: newtop+'px'}); 
} 

Answer 4

जोड़ने तैनात उत्तर देने के लिए विकल्प है, तो आप एक += शॉर्टकट .animate() के माध्यम से नहीं अवधि के साथ इस तरह का उपयोग कर सकते:

$(".scroll-content").animate({ top: "+=250px" }, 0);​ 

यह परिवर्तन तुरन्त 250px जोड़ने कर देगा। यदि आप वास्तव में एनिमेटेड चाहते थे, तो उदाहरण के लिए, 0 को 400 में बदलें, उदाहरण के लिए, 400 एमएमएस अवधि प्राप्त करें।