ui.widget.ScrollTo
ScrollTo વિજેટનો ઉપયોગ કરવામાં મુખ્ય સમસ્યા એ છે કે જ્યારે વપરાશકર્તા વિજેટ પર ક્લિક કરશે ત્યારે તેનું કર્સર ક્યાં ખસેડશે તે નિયંત્રિત કરવું મુશ્કેલ બની શકે છે. આનાથી યુઝર ઇન્ટરફેસ બનાવવું મુશ્કેલ બની શકે છે જે ઉપયોગમાં સરળ છે.
$(window).scroll(function() {
var scroll = $(window).scrollTop();
//>=, not <=
if (scroll >= 100) {
//clearHeader, not clearheader - caps H
$("#header").addClass("scrolled");
} else {
$("#header").removeClass("scrolled");
} }); //missing );
આ કોડ jQuery માં લખાયેલ છે અને જ્યારે વપરાશકર્તા પૃષ્ઠને નીચે સ્ક્રોલ કરે છે ત્યારે તેનો ઉપયોગ તત્વના CSS વર્ગને બદલવા માટે થાય છે.
પ્રથમ લાઇન એક ફંક્શન બનાવે છે જે વપરાશકર્તા જ્યારે સ્ક્રોલ કરશે ત્યારે એક્ઝિક્યુટ થશે. બીજી પંક્તિ વપરાશકર્તાએ 'સ્ક્રોલ' નામના ચલમાં સ્ક્રોલ કરેલ પૃષ્ઠ કેટલા નીચે છે તેની કિંમત સંગ્રહિત કરે છે. ત્રીજી પંક્તિ કહે છે કે જો 'સ્ક્રોલ' ની કિંમત 100 કરતા વધારે અથવા બરાબર હોય, તો 'હેડર' ની આઈડી સાથેના તત્વના CSS વર્ગને 'સ્ક્રોલ'માં બદલવો જોઈએ. જો નહીં, તો તેને તેના મૂળ વર્ગમાં પાછું બદલવું જોઈએ.
આયાત
jQuery તમારા પ્રોજેક્ટમાં અન્ય JavaScript ફાઇલોને આયાત કરવાની અનુકૂળ રીત પ્રદાન કરે છે. આ કરવા માટે, jQuery import() ફંક્શનનો ઉપયોગ કરો. ઉદાહરણ તરીકે, તમારા પ્રોજેક્ટમાં myfile.js ફાઇલ આયાત કરવા માટે, તમે નીચેના કોડનો ઉપયોગ કરશો:
'./myfile.js' માંથી { myFile } આયાત કરો;
આ તમારા વર્તમાન પ્રોજેક્ટ સ્કોપમાં myfile.js ને આપમેળે સામેલ કરશે અને તેને તમારા કોડમાં ઉપયોગ માટે ઉપલબ્ધ કરાવશે.
વિકાસકર્તા સાધનો
ત્યાં સંખ્યાબંધ વિકાસકર્તા સાધનો છે જે jQuery માં ઉપલબ્ધ છે. આ ટૂલ્સનો ઉપયોગ કોડ ડીબગ કરવા, DOM તત્વોને તપાસવા અને સંશોધિત કરવા અને વધુ માટે થઈ શકે છે.
