જ્યારે છબીઓમાં સુધારો થાય છે ત્યારે અમે તેને ફોટોશોપથી કરવાનું પસંદ કરી શકીએ છીએ અને પછી તેને વેબ પૃષ્ઠ પર માઉન્ટ કરી શકીએ છીએ અથવા આપણે B વિકલ્પ પસંદ કરી શકીએ છીએ. તે ઉપલબ્ધ એચટીએમએલ, સીએસએસ અને જાવાસ્ક્રિપ્ટ તકનીકોથી કરો.
કૂદકા પછી છબીઓ સુધારવા માટે ઘણી તકનીકીઓ છે, તેમાંના લગભગ બધા જ jQuery સાથે મુખ્ય આધાર તરીકે અથવા CSS3 સાથે બનાવેલ છે. નવીનતમ વેબ ધોરણોનો લાભ લઈ રહ્યો છું, તેમ છતાં હું તમને યાદ કરાવું છું કે તે કિસ્સામાં અમે કેટલાક બ્રાઉઝર્સ સાથે સુસંગતતા ગુમાવીશું.
તેઓ અંગ્રેજીમાં છે પરંતુ તેઓ ફ્લાય પર પકડાય છે, વચન આપ્યું છે :)
સ્રોત | 1 લી ડબલ્યુડી
CSS3 jQuery સાથે ગોળાકાર છબી
બધા આધુનિક બ્રાઉઝર્સમાં પ્રદર્શિત થશે તેવા ગોળાકાર છબીઓ પ્રાપ્ત કરવા માટે છબી તત્વની આસપાસનો સ્પ aroundન ટ tagગ લપેટવાનું શીખો.
2.
સીએસએસ 2.1 સાથે બહુવિધ પૃષ્ઠભૂમિ અને બોર્ડર્સ
એક જ HTML ઘટક માટે 2.1 પૃષ્ઠભૂમિ કેનવેસેસ, 3 નિશ્ચિત-કદની પ્રસ્તુતિત્મક છબીઓ અને બહુવિધ જટિલ સરહદો પ્રદાન કરવા માટે સીએસએસ 2 સ્યુડો-એલિમેન્ટ્સનો ઉપયોગ કેવી રીતે કરવો તે જાણો.
3.
ઝડપી ટીપ: સરળ સીએસએસ સાથે બહુવિધ બોર્ડર્સ
ઝડપી સ્ક્રીનકાસ્ટ તમને બતાવે છે કે કેવી રીતે સરળ સીએસએસ સાથે બહુવિધ સરહદો પ્રાપ્ત કરવી તે રીતે તમારી ડિઝાઇનમાં વધુ depthંડાઈ ઉમેરવા. પહેલાનાં ટ્યુટોરિયલનું ખૂબ સરળ સંસ્કરણ.
4.
સીએસએસ 2 સાથે ગતિશીલ કદના તત્વો પર બહુવિધ બોર્ડર્સ
નું ત્રીજું સંસ્કરણ નિકોલસ ગેલાઘર જો તમે તત્વનું કદ નહીં કરો તો શું કરવું તે બતાવી રહ્યું છે.
5.
મનોરંજન ડબલ્યુ / બોર્ડર્સ - બેવલ્ડ, પ્રેસ અને વધુ!
વિવિધ અસરો મેળવવા માટે સીએસએસ અને કેટલાક સરળ સરહદ શૈલી યુક્તિઓ સાથે દબાવવામાં અસર કેવી રીતે પ્રાપ્ત કરવી તે જાણો.
6.
CSS3 સાથે પોલરોઇડ્સ
પોલરોઇડ ચિત્રોના સંપૂર્ણ વિકસિત સમૂહમાં છબીઓની અસાધારણ સૂચિને ફેરવવા માટે કેટલાક અદ્ભુત CSS2 અને CSS3 નો ઉપયોગ કેવી રીતે કરવો તે શીખો.
7.
પરફેક્ટ પૂર્ણ પૃષ્ઠ પૃષ્ઠભૂમિ છબી
સીએસએસ સાથે પૃષ્ઠભૂમિ છબી કેવી રીતે ઉમેરવી તે શીખો કે જે સંપૂર્ણ પૃષ્ઠને છબીથી ભરે છે, કોઈ સફેદ જગ્યા નથી, જરૂરિયાત મુજબ ભીંગડાની છબી નથી, સ્ક્રોલબાર્સનું કારણ નથી અને ઘણું વધારે.
8.
CSS3 બ Shaક્સ શેડો અને છબી હોવર ઇફેક્ટ્સ
ફક્ત સ્ટાઇલ શીટને સંપાદિત કરીને ડ્રોપ શેડો ઇફેક્ટ્સ ઉમેરવાની નવી રીતનું અન્વેષણ કરો.
9.
ફેન્સી થંબનેલ હોવર ઇફેક્ટ ડબલ્યુ / jQuery
સીએસએસ અને jQuery સાથે સુઘડ ફ્લેશ-શૈલી અસર પ્રાપ્ત કરો.
10.
સરળ સીએસએસ ઇમેજ રોલઓવર અસર કેવી રીતે બનાવવી
આ ટ્યુટોરીયલમાં તમે મૂળભૂત એચટીએમએલ અને સીએસએસ સ્ટાઇલ સાથે સરળ સીએસએસ ઇમેજ રોલઓવર અસર કેવી રીતે બનાવવી તે શીખીશું.
11.
ફ્લોટોરીયલ
ફ્લોટ ટ્યુટોરિયલ તમને છબીઓ, ડ્રોપ કેપ્સ, આગલા અને પાછળના બટનો, છબી ગેલેરીઓ, ઇનલાઇન સૂચિઓ અને મલ્ટી ક -લમ લેઆઉટ જેવા ફ્લોટિંગ તત્વોની મૂળભૂત બાબતોમાં લઈ જશે. તરતા તસવીરને સમર્પિત 4 ટ્યુટોરિયલ્સ તપાસો.
12.
સીએસએસનો ઉપયોગ કરીને સ્નazઝી હ Hવર ઇફેક્ટ્સ
આ ટ્યુટોરીયલમાં, તમે CSS2.1 ગુણધર્મોનો ઉપયોગ કરીને લવચીક અદ્યતન હોવર તકનીકીઓ બનાવવાનું ચાલુ કરશો.
13.
વગર ઝડપી રોલઓવર
પ્રીલોડ
સીએસએસ ઇમેજ રોલઓવરનો ઉપયોગ કરતી વખતે, બે, ત્રણ, અથવા વધુ છબીઓ લોડ થવી આવશ્યક છે (અને હંમેશાં શ્રેષ્ઠ પરિણામો માટે પહેલાથી લોડ કરવામાં આવે છે). કેવી રીતે તમામ રાજ્યોને એક છબીમાં મૂકવી તે શીખો, ગતિશીલ ફેરફારો ઝડપથી થાય છે અને તેને કોઈ પ્રીલોડની જરૂર નથી.
14.
jQuery ગોળાકાર ખૂણા
ગોળાકાર ખૂણા અને વધુ દાખલાઓ માટે ઘણી બધી jQuery અસરો.
15.
JQuery નો ઉપયોગ કરીને સૌથી સરળ ટૂલટિપ અને છબી પૂર્વાવલોકન
JQuery રોલઓવર પૂર્વાવલોકન સ્ક્રિપ્ટનો ઉપયોગ કરવાના 3 ઉદાહરણો જુઓ. આ સરળ સ્ક્રિપ્ટ વિવિધ હેતુઓ માટે લાગુ કરી શકાય છે.
16.
સુપરસાઇઝ્ડ - પૂર્ણ સ્ક્રીન પૃષ્ઠભૂમિ /
સ્લાઇડ શો
jQuery પ્લગઇન
સુપરઝાઇડ એ jQuery પ્લગઇન છે જે સંક્રમણો અને પ્રીલોડિંગ સાથે સ્લાઇડ શો દ્વારા ઇમેજ ડાયમેન્શન રેશિયો અને સાયકલ્સ છબીઓ / બેકગ્રાઉન્ડને જાળવી રાખતા બ્રાઉઝરને ભરવા માટે છબીઓનું કદ બદલી નાખે છે.
17.
પી.એન.જી. ઓવરલે
શું તમે ક્યારેય ક્લાયંટ દ્વારા અપાયેલી ચિત્રોવાળી કોઈ સાઇટ બનાવવાની સમસ્યામાં ભાગ લીધો છે, પછી તેઓ તેમના ફોટોગ્રાફીને મૂળ દેખાવ અપડેટ કર્યા પછી જ શોધી શકશે અને અનુભૂતિ જાળવી નથી? આ ઉકેલમાં પારદર્શક પીએનજી ઓવરલે બનાવવાનો સમાવેશ થાય છે જેનો ઉપયોગ નિયમિત જેપીઇજી અથવા જીઆઈએફની આસપાસ માસ્ક / ફ્રેમ તરીકે થઈ શકે છે. આ રીતે, લાક્ષણિક સીએમએસ ઇન્સ્ટોલેશનને ગોઠવી શકાય છે જેથી વપરાશકર્તાઓ ફિલ્ટરો લાગુ કરવા માટે કોઈપણ ગ્રાફિક્સ પ્રોગ્રામનો ઉપયોગ કરવાની ચિંતા કર્યા વિના ફોટા અપલોડ કરી શકે.
18.
બેઝૂમ
લાઇટ વેઇટ
JQuery
ઝૂમ પ્લગઇન
બેઝૂમ એ એક સરળ અને લાઇટવેઇટ વિકલ્પ છે જેક્યુઝૂમ. તે હળવા છે અને તેનો ઉપયોગ સરળ છે.
19.
પૃષ્ઠભૂમિ છબી એનિમેશન માટે jQuery નો ઉપયોગ કરવો
JQuery સાથે રમો અને તમે જે પ્રકારનો પ્રભાવ શોધી રહ્યાં છો તે બનાવવા માટે પૃષ્ઠભૂમિ છબીની સ્થિતિ બદલો. "હું સક્રિય સ્થિતિઓને કેવી રીતે સંચાલિત કરી શકું?" નો જવાબ આપતો એક નવો લેખ છે. - JQuery એનિમેટેડ પૃષ્ઠભૂમિની માટે સક્રિય સ્થિતિનું સંચાલન.
20.
સીએસએસ સાથે તમારી છબીઓને સ્પાઇસ કરવાની 5 રીત
તમારી લાક્ષણિક નસીબ છબીઓમાં થોડો સ્વાદ ઉમેરવા માટે અહીં કેટલીક સરળ યુક્તિઓ છે. ફોટોશોપનો ઉપયોગ દરેક ઇમેજને સ્ટાઇલ કરવા માટે, કંટાળાજનક અને લાંબા ગાળે જાળવવું મુશ્કેલ હોઈ શકે છે. આ નીચેની સીએસએસ તકનીકો તમને તે પીડાને સરળ કરવામાં મદદ કરશે.
21.
કઈ રીતે:
કદ બદલી શકાય તેવું
પૃષ્ઠભૂમિ છબી
સીએસએસ સાથે ફરીથી કદમાં બદલી શકાય તેવી પૃષ્ઠભૂમિ છબી કેવી રીતે સેટ કરવી તે જાણો. તમારી પાસે પસંદગી માટે 3 વિકલ્પો છે.
22.
તમારી છબી લિંક્સને સ્ટાઇલ કરો
વપરાશકર્તાઓને જણાવવું કે અમારી વેબસાઇટના ચોક્કસ વિભાગ પર ક્લિક કરવાનું છે, તે માઉસ ઓવર ઇફેક્ટ દ્વારા શ્રેષ્ઠ પ્રાપ્ત થાય છે. તે "ક્લિક કરવા યોગ્ય" વિભાગોમાં ચોક્કસપણે સામગ્રી છબીઓ શામેલ છે. છબી લિંક એ એક સ્ક્રિપ્ટ છે જે તમને તમારી છબી લિંક્સ પર વધારાના સ્ટાઇલ લાગુ કરવા માટે સક્ષમ કરે છે.
23.
સીએસએસ સાથે બહુવિધ પૃષ્ઠભૂમિ છબીઓ
અમુક સમયે, પૃષ્ઠભૂમિ છબીઓને સીધા પૃષ્ઠમાં શામેલ કરવા કરતાં તેનો ઉપયોગ કરવામાં વધુ સમજણ પડે છે. અને જ્યારે દરેક તત્વ - જેમ કે તમારા શરીરના ટ likeગ - ફક્ત એક જ પૃષ્ઠભૂમિ છબી ધરાવે છે, તે ઘણા તત્વો પર લાગુ થઈ શકે છે.
24.
સીએસએસ સાથે છબી બોર્ડર્સ
CSS નો ઉપયોગ કરીને છબીઓમાં નક્કર સરહદ કેવી રીતે ઉમેરવી તે બતાવવાનું ખરેખર સરળ ટ્યુટોરિયલ.
25.
પૃષ્ઠભૂમિ છબીઓનો ઉપયોગ કર્યા વિના સીએસએસ સ્પ્રાઈટ્સ
સીએસએસ સ્પ્રાઈટ્સ વિશે ઘણું જ્ knowledgeાન વિના હોવર અસર કેવી રીતે લાગુ કરવી તે શીખો.
