½ÃÀÛÆäÀÌÁö·Î Áñ°Üã±âÃß°¡
·Î±×ÀÎ
ȸ¿ø°¡ÀÔ l Ã⼮üũ l ¸¶ÀÌÆäÀÌÁö l CGIMALL
happycgi
ÀÚ·á½Ç »çÀÌÆ®µî·Ï ·©Å·100 ÇÁ·Î±×·¥¸®ºä °ü¸®ÀÚÃßõÀÚ·á Ãʺ¸°¡À̵å
Ä¿¹Â´ÏƼ
Àüü ÆîÃ帱â
Äü¸Þ´º¸µÅ© jquery , CSS , PHP , Javascript , ¹«·áÆùÆ® , ASP
»ó¼¼°Ë»ö
Ȩ > JAVASCRIPT > javascript ¼Ò½ºÃ¢°í > JQuery > jquery.parallax.js ver2.0.0-alpha »ó¼¼Á¤º¸
»çÀÌÆ®µî·Ï
Ŭ¶ó¿ìµåű×
javascript
PHP
HTML
ASP
mysql
CSS
Mobile
image
jquery
slide
¸Þ´º
�޴�
2023
ÇöÀçÁ¢¼ÓÀÚ ¸í »õ·Î°íħ
jquery.parallax.js ver2.0.0-alpha
¼Ò½ºÅë°èÁ¤º¸ ¿À·ù½Å°í ¹× ¹®ÀÇ
ÇØÇÇÆÀ
³×ƼÁð
Æ®À§ÅÍ·Î º¸³»±â ÆäÀ̽ººÏÀ¸·Î º¸³»±â
¼Ò½ººÐ·ù JQuery
´Ù¿î·Îµå Ƚ¼ö 86 ȸ
°£´Ü¼³¸í jquery ·Î ±¸ÇöµÈ ½ºÅ©·Ñ È¿°úÇÁ·Î±×·¥
Æò°¡Çϱâ ÈǸ¢ÇÔ ¸Å¿ìÁÁÀ½ ÁÁÀ½ ±¦ÂúÀ½ º¸Åë º°·Î
ȨÆäÀÌÁö¹Ù·Î°¡±â ¼Ò½º´Ù¿î·Îµå µ¥¸ð ¹Ì¸®º¸±â ½ºÅ©·¦Çϱâ

* jquery.parallax.js

   - css3ÀÇ Æ®·£½ºÆûÀ» ÀÌ¿ëÇÑ parallax ½ºÅ©·Ñ ÇüÅÂÀÇ ¿øÆäÀÌÁö µðÀÚÀÎÆäÀÌÁö ÀÔ´Ï´Ù.
     °£´ÜÇÑ ¿øÆäÀÌÁö ÇüÅÂÀÇ È¸»ç¼Ò°³ ÆäÀÌÁö³ª. Æ÷Æ®Æú¸®¿À ¿ë, ¶Ç´Â À̺¥Æ®ÇüÀ¸·Î »ç¿ëÇϽøé ÁÁÀº¼Ò½ºÀÔ´Ï´Ù.
     ¶óÀ̼¾½º´Â MIT¶óÀ̼¾½ºÀ̸ç ÆÄÀϾȿ¡¼­µµ È®ÀÎÇÏ½Ç ¼ö ÀÖ½À´Ï´Ù.
     ¸¶Å©¾÷ ¹× »ç¿ë¹æ¹ýÀº À§ µ¥¸ð»çÀÌÆ®ÁÖ¼Ò·Î µé¾î°¡½Ã¸é È®ÀÎÇϽǼö ÀÖÀ¸¸ç ´Ù¿îµµ ¹ÞÀ¸½Ç ¼ö ÀÖ½À´Ï´Ù.



* ÀÌ¿ë¹æ¹ý

   - ÷ºÎµÈ ¾ÐÃâÆÄÀÏÀ» ¾ÐÃàÇØÁ¦ÇÏ°í »ç¿ëÇÏ·Á´Â À¥µð·ºÅ͸®¿¡ ¾÷·Îµå¸¦ ÇÕ´Ï´Ù
     ¹®¼­ »ó´Ü¿¡ »ùÇà css ÆÄÀÏ°ú jquery ÆÄÀÏÈ£Ãâ ¹× ½ºÅ©·Ñ½Ã À̹ÌÁö°¡ º¸¿©Áà¾ßµÉ 
     ¿µ¿ª¿¡ ´ëÇÑ ³ôÀÌ°ªÀ» Á¶Á¤ ÇÏ´Â ½ºÅ©¸³Æ®¸¦ »ðÀÔÇÕ´Ï´Ù
     


   ±×¸®°í ½ºÅ©·Ñ Çϸ鼭 º¸¿©Áà¾ßµÉ ¹®±¸¿Í À̹ÌÁö ¼³Á¤Àº ¾Æ·¡¿Í °°ÀÌ
   class ·Î ¼±¾ðÇÏ¿© ÇØ´ç ¿µ¿ª¾È¿¡
   ÆÄÆ®º°·Î ³»¿ëµéÀ» »ðÀÔ ÇÒ ¼ö ÀÖµµ·Ï µÇ¾îÀÖÀ¸¸ç µ¥ÀÌÅÍ ¼Ó¼ºÀ» ÅëÇØ ¿ä¼ÒµÚ¿¡ È¿°ú¸¦ Ãß°¡ÇÒ ¼öµµ ÀÖ½À´Ï´Ù
   ex)
   data-parallax data-mirror-selector=".mirrorContainer" data-scrolling-selector=".scrollingElement"="scroll"
   data-src="/path/to/image.jpg"
   
    
   

   µ¥ÀÌÅÍ ¼Ó¼ºÀ» ÅëÇØ ¿É¼ÇÀ» Àü´ÞÇÒ ¼ö ÀÖ½À´Ï´Ù.
   µ¥ÀÌÅÍ ¼Ó¼ºÀÇ °æ¿ì¿¡ data-¿Í °°ÀÌ ¿É¼Ç À̸§À»¿¡ Ãß°¡ÇÏ½Ã¸é µË´Ï´Ù(data-src="".)
   Á¦°øµÇ´Â ¿É¼ÇÀº ¾Æ·¡¿Í °°½À´Ï´Ù
  
Name type default description
imageSrc path null ½ÃÂ÷ È¿°ú¿¡ Àû¿ë ÇÒ À̹ÌÁöÀÇ °æ·Î¸¦ Á¦°øÇؾßÇÕ´Ï´Ù.
naturalWidth number auto À̹ÌÁöÀÇ ÀÚ¿¬½º·¯¿î ³Êºñ¿Í ÀÚ¿¬½º·¯¿î ³ôÀ̸¦ Á¦°øÇÏ¿©·Îµå
¼Óµµ¸¦ ³ôÀÌ°í À̹ÌÁöÀÇ Á¤È®ÇÑ Á¾È¾ºñ¸¦
°áÁ¤ÇÒ ¶§ ¿À·ù¸¦ ÁÙÀÏ ¼ö ÀÖ½À´Ï´Ù.
naturalHeight number auto
position xPos yPos center
center
¹è°æ À§Ä¡ CSS ¼Ó¼º°ú À¯»çÇÕ´Ï´Ù. 
ÁÂÇ¥¸¦ À§, ¾Æ·¡, ¿À¸¥ÂÊ, ¿ÞÂÊ,
°¡¿îµ¥ ¶Ç´Â Çȼ¿ °ª (¿¹ : -10px 0px)À¸·Î ÁöÁ¤ÇϽʽÿÀ. 
½ÃÂ÷ À̹ÌÁö´Â ´ë»ó ¿ä¼Ò¸¦ °è¼Ó µ¤°í
°¡´ÉÇÑ ÇÑÀÌ °ª¿¡ °¡±õ°Ô À§Ä¡ÇÕ´Ï´Ù.
positionX xPos center
positionY yPos center
speed float 0.2 ½ÃÂ÷ È¿°ú°¡ ½ÇÇàµÇ´Â ¼ÓµµÀÔ´Ï´Ù. 
0.0Àº À̹ÌÁö°¡ °íÁ¤ µÈ À§Ä¡¿¡ °íÁ¤ µÈ °Íó·³ º¸ÀÔ´Ï´Ù.
1.0Àº À̹ÌÁö°¡ ÆäÀÌÁö ³»¿ë°ú µ¿ÀÏÇÑ ¼Óµµ·Î È帣°ÔµË´Ï´Ù.
zIndex number -100 °íÁ¤ À§Ä¡ ¿ä¼ÒÀÇ z- À妽º °ªÀÔ´Ï´Ù. 
±âº»ÀûÀ¸·Î À̵éÀº ÆäÀÌÁöÀÇ ´Ù¸¥ ¸ðµç °Í µÚ¿¡ ÀÖ½À´Ï´Ù.
ÃâÇ÷ number 0 ¼±ÅÃÀûÀ¸·Î ½ÃÂ÷ °Å¿ï ¿ä¼Ò¸¦ ¹Ì·¯ ¿ä¼ÒÀÇ
À§¾Æ·¡·Î ¸î Çȼ¿ ¿¬ÀåÇϵµ·Ï ¼³Á¤ÇÒ ¼ö ÀÖ½À´Ï´Ù. 
ÀÌ·¸°ÔÇϸé ƯÁ¤ ºê¶ó¿ìÀú¿¡¼­ ´À¸®°Å³ª
ÀÌ»óÇÑ ½ºÅ©·Ñ À̺¥Æ®¸¦ ¼û±æ ¼ö ÀÖ½À´Ï´Ù.
iosFix boolean true iOS ±â±â´ÂÀÌ Ç÷¯±×Àΰú ȣȯµÇÁö ¾Ê½À´Ï´Ù. 
trueÀ̸éÀÌ ¿É¼ÇÀº iOS »ç¿ëÀÚ ¿¡ÀÌÀüÆ®¸¦ °¨Áö ÇÒ ¶§¸¶´Ù
½ÃÂ÷ À̹ÌÁö¸¦ Á¤Àû Á᫐ ¸ÂÃã ¹è°æ À̹ÌÁö·Î ¼³Á¤ÇÕ´Ï´Ù. 
ÀڽŠ¸¸ÀÇ ¿ì¾ÆÇÑ ¼º´É ÀúÇϸ¦ ±¸ÇöÇÏ·Á¸éÀÌ ±â´ÉÀ» ÇØÁ¦ÇϽʽÿÀ.
androidFix boolean true trueÀ̸éÀÌ ¿É¼ÇÀº Android »ç¿ëÀÚ ¿¡ÀÌÀüÆ®¸¦ °¨Áö ÇÒ ¶§¸¶´Ù
½ÃÂ÷ À̹ÌÁö¸¦ Á¤Àû Á᫐ ¸ÂÃã ¹è°æ À̹ÌÁö·Î ¼³Á¤ÇÕ´Ï´Ù. 
Android ±â±â¿¡¼­ ½ÃÂ÷ ½ºÅ©·Ñ È¿°ú¸¦
»ç¿ëÇÏ·Á¸éÀÌ ±â´ÉÀ» »ç¿ë ÁßÁöÇÕ´Ï´Ù.




³×ƼÁð ÀÇ°ß   ÀÌ¿ëÇϽŠÀÚ·áÀÇ Èı⸦ ÀÚÀ¯·Ó°Ô ÀÛ¼ºÇϼ¼¿ä. (»ó¾÷ÀûÀÎ ±¤°í ¹× µµ¹è¼º ±Û µîÀº »çÀüÅ뺸¾øÀÌ »èÁ¦µÉ ¼ö ÀÖ½À´Ï´Ù.)
³»¿ë ¾ÆÀ̵ð ÀÇ°ß³²±â±â
µî·ÏµÈ ÀÇ°ßÀÌ ¾ø½À´Ï´Ù.
1
À̸§
³»¿ë
:³×¸Â¾Æ¿ä: :È­³ª´Â±º¿ä: :Àá¿Í: :¿ì¿ïÇØ: :À̰ǾƳÄ: :¿ÕÇÏÇÏ: ¿Õ¿ôÀ½~ ³î·¥~
Æò°¡Çϱâ ÈǸ¢ÇÔ ¸Å¿ìÁÁÀ½ ÁÁÀ½ ±¦ÂúÀ½ º¸Åë º°·Î
µµ¹è¹æÁöÅ°
 58578662 º¸ÀÌ´Â µµ¹è¹æÁöÅ°¸¦ ÀÔ·ÂÇϼ¼¿ä.