ਜੇਕਉਐਰੀ ਲਾਇਬਰੇਰੀ: ਆਪਣੀ ਵੈਬਸਾਈਟ ਲਈ ਸਲਾਈਡਰ

ਵਾਰ ਦੇ ਬੀਤਣ ਅਤੇ ਵੈਬ ਡਿਜ਼ਾਇਨ ਦੇ ਖੇਤਰ ਬਦਲ ਰਹੀ ਹੈ ਅਤੇ ਲੋੜ / ਸਮੱਗਰੀ ਨੂੰ ਸਾਈਟ ਨੂੰ ਉਪਭੋਗੀ ਦੀ ਲੋੜ ਹਨ, ਵਿੱਚ ਤਕਨਾਲੋਜੀ ਦੇ ਵਿਕਾਸ ਦੇ ਨਾਲ. ਪਿਛਲੇ ਜੇਕਰ ਇਸ ਨੂੰ ਜ਼ਿਆਦਾਤਰ ਥੀਮੈਟਿਕ ਚਿੱਤਰ ਦੇ ਇੱਕ ਛੋਟੀ ਜਿਹੀ ਗਿਣਤੀ ਨਾਲ ਪਾਠ ਸਮੱਗਰੀ ਨੂੰ ਸੀ, ਨੇ ਅੱਜ ਇਸ ਨੂੰ ਗ੍ਰਾਫਿਕ ਦਾ ਮੁੱਖ ਹਿੱਸਾ ਹੈ. ਇਹ ਤੁਹਾਨੂੰ ਤੇਜ਼ੀ ਨਾਲ ਸਭ ਜਰੂਰੀ ਹੈ ਅਤੇ ਲਾਭਦਾਇਕ ਜਾਣਕਾਰੀ ਪ੍ਰਾਪਤ ਕਰਨ ਲਈ, ਅਤੇ ਵਾਰ ਬਰਬਾਦ ਨਾ ਕਰੋ ਲੰਬੇ ਟੈਕਸਟ ਨੂੰ ਪੜ੍ਹਨ ਲਈ ਸਹਾਇਕ ਹੈ. ਇਸ ਵਧਦੀ ਪ੍ਰਸਿੱਧ ਹੈ ਅਤੇ ਅਸਲ ਵਿਚ, ਦੇ ਨਾਲ ਕੁਨੈਕਸ਼ਨ ਵਿੱਚ, ਇੱਕ ਵੈੱਬ ਸਫ਼ੇ ਦਾ ਇੱਕ ਜ਼ਰੂਰੀ ਤੱਤ ਸਲਾਈਡਰ ਹਨ. ਚਿੱਤਰ ਲਿੰਕ ਨੂੰ - ਉਹ ਵਿੱਚ ਸਮੱਗਰੀ ਨੂੰ ਵੱਖ ਨਾਲ ਬਲਾਕ ਹਨ. ਜੇਕਉਐਰੀ ਲਾਇਬਰੇਰੀ - ਇੱਕ ਦਿੱਤੇ ਵੈੱਬ ਇਕਾਈ ਨੂੰ ਸ਼ਾਮਿਲ ਕਰਨ ਲਈ ਇੱਕ ਆਧੁਨਿਕ ਤਰੀਕਾ ਹੈ. ਇਹ ਟੂਲ ਨਾਲ ਬਣਾਇਆ ਸਲਾਈਡਰ, ਇੱਕ ਆਰਾਮਦਾਇਕ, ਵਰਤਣ ਲਈ ਆਸਾਨ ਪ੍ਰਾਪਤ ਹੈ, ਅਤੇ ਬਹੁਤ ਹੀ ਪ੍ਰਭਾਵਸ਼ਾਲੀ ਵੇਖਦਾ ਹੈ. ਅੱਗੇ ਸਾਨੂੰ ਆਪਣੇ ਆਪ ਤੇ ਹੀ ਵੈੱਬ ਸਫ਼ੇ ਦੇ ਇਹ ਤੱਤ ਕਰਨ ਲਈ 'ਤੇ ਝਾਤੀ. ਪਰ੍ਮਾਣੀਿਕਰ੍ਤ ਸੰਦ ਦੀ ਇੱਕ ਨੂੰ ਕਾਫੀ ਵੱਡੀ ਗਿਣਤੀ ਕਰਨ ਲਈ ਧੰਨਵਾਦ ਹੈ, ਇਸ ਨੂੰ ਜੇਕਉਐਰੀ ਸਲਾਇਡਰ-ਕਿਸਮ ਦੀ ਹੈ ਅਤੇ ਵੱਖ-ਵੱਖ ਸਮੱਗਰੀ ਨੂੰ ਲਾਗੂ ਕਰਨ ਲਈ ਸੰਭਵ ਹੈ.

ਇੱਕ ਵੈੱਬ ਸਫ਼ੇ 'ਤੇ ਇੱਕ ਸਲਾਇਡਰ ਨੂੰ ਜੋਡ਼ਨ ਲਈ?

ਤਰੀਕੇ ਇੱਕ ਸਲਾਇਡ-ਬਲਾਕ ਨੂੰ ਸ਼ਾਮਿਲ ਕਰਨ ਲਈ ਸਫ਼ੇ ਨੂੰ ਨੰਬਰ. ਅਕਸਰ ਇਹ ਵੀ ਕਿ HTML-ਕੋਡ ਲਿਖ ਅਤੇ ਸਕਰਿਪਟ ਵਿੱਚ ਬੁੱਧੀਮਾਨ ਕਰਨ ਲਈ ਹੈ, ਨਾ ਕਰੋ. ਉੱਥੇ ਮੁਫ਼ਤ ਲਾਇਬਰੇਰੀ ਦੀ ਕਾਫੀ ਗਿਣਤੀ ਹੈ, ਉਪਭੋਗੀ ਨੂੰ ਇੱਕ ਤਿਆਰ-ਕੀਤੀ ਖਾਕੇ ਤੁਹਾਨੂੰ ਆਪਣੀ ਸਾਈਟ 'ਤੇ ਜੇਕਉਐਰੀ-ਸਲਾਈਡਰ ਨੂੰ ਜੋਡ਼ਨ ਚਾਹੀਦਾ ਹੈ, ਜੋ ਕਿ ਦੀ ਪੇਸ਼ਕਸ਼ ਕਰਦਾ ਹੈ. ਤੁਹਾਨੂੰ ਕੀ ਕਰਨ ਦੀ ਹੈ, - ਆਪਣੇ ਵੈੱਬ ਸਫ਼ੇ ਦੇ ਸਰੋਤ ਕੋਡ ਵਿੱਚ ਇਸ ਨੂੰ ਨਕਲ ਕਰੋ ਅਤੇ ਨਤੀਜੇ ਦਾ ਆਨੰਦ ਕਰਨ ਲਈ ਹੁੰਦਾ ਹੈ. ਪਰ, ਇਸ ਮਾਮਲੇ 'ਚ ਆਪਣੇ ਰਚਨਾਤਮਕ ਕਲਪਨਾ ਦੇ ਬੋਧ ਦੀ ਸੰਭਾਵਨਾ ਸੀਮਤ ਹੈ. ਇਸ ਲਈ, ਇਸ ਨੂੰ ਸੁਤੰਤਰ ਡਿਜ਼ਾਇਨ ਇਕਾਈ ਬਣਾਉਣ ਲਈ ਯੋਗ ਹੋਣ ਲਈ ਲਾਭਦਾਇਕ ਹੈ. ਇਹ ਕਰਨ ਲਈ, ਤੁਹਾਨੂੰ ਕਿਸ ਨੂੰ ਪਤਾ ਕਰਨ ਲਈ ਸਧਾਰਨ ਜੇਕਉਐਰੀ ਸਲਾਇਡਰ ਨੂੰ ਲਾਗੂ ਕਰਨ ਦੀ ਲੋੜ ਹੈ, ਅਤੇ ਸਿਰਫ ਇਸ ਨੂੰ ਗੁੰਝਲਦਾਰ, ਤੁਹਾਨੂੰ ਹਮੇਸ਼ਾ ਕੋਡ ਵਿੱਚ ਵਾਧੂ ਤੱਤ ਨੂੰ ਸ਼ਾਮਿਲ ਕਰ ਸਕਦੇ ਹੋ.

ਆਪਣੇ ਆਪ ਨੂੰ ਦੇ ਕੇ ਇੱਕ ਸਲਾਇਡਰ ਬਣਾਓ: HTML ਕੋਡ ਵਿੱਚ

ਪਹਿਲੀ, ਜਿੱਥੇ ਸ਼ੁਰੂ ਕਰਨ ਲਈ - ਸਲਾਇਡਰ ਦੇ ਭਵਿੱਖ ਦਾ ਖਾਕਾ ਰਜਿਸਟਰ ਕਰਨ ਲਈ ਹੁੰਦਾ ਹੈ.

1. ਨੂੰ HTML ਫਾਇਲ-ਸਲਾਇਡ ਯੂਨਿਟ ਹੈ, ਜੋ ਕਿ ਸਾਡੇ ਸਲਾਇਡਸ ਦੇ ਸਾਰੇ ਹੁੰਦੇ ਹਨ (ਚਿੱਤਰ, ਆਦਿ) ਵਿਚ ਸਥਾਪਿਤ ਕੀਤਾ.
2. ਇਹ ਉਲ ਸੂਚੀ ਵਿੱਚ ਰੱਖ, ਜਿਸ ਦੀ ਹਰੇਕ ਪੈਰੇ ਇੱਕ ਵੱਖਰੀ ਸਲਾਇਡ ਸਟੋਰ ਕਰੇਗਾ.

ਸਾਨੂੰ CSS ਦੇ ਨਾਲ ਕੰਮ ਕਰ ਰਹੇ ਹਨ,

ਫਿਰ ਸਾਨੂੰ ਇਸ ਨੂੰ ਕਰਨ ਲਈ CSS-ਦਸਤਾਵੇਜ਼ ਨੂੰ ਵਰਤ ਲੋੜੀਦਾ ਸ਼ੈਲੀ ਦੇ ਗੁਣ ਲਾਗੂ ਹੁੰਦੇ ਹਨ. ਇਹ ਸਹੀ ਢੰਗ ਨਾਲ ਕੰਮ ਕਰਨ ਦੀ ਸਾਡੀ ਸਮੱਗਰੀ ਨੂੰ ਜੇਕਉਐਰੀ ਸਲਾਇਡਰ ਲਗਾ ਲਈ ਜ਼ਰੂਰੀ ਹੈ ਅਤੇ ਸਹੀ ਨਜ਼ਰ ਸੀ. ਇਸ ਪੜਾਅ 'ਤੇ, ਸਾਨੂੰ ਹੇਠ ਦਿੱਤੇ ਕੰਮ ਦੇ ਨਾਲ ਦਾ ਸਾਹਮਣਾ ਕਰ ਰਹੇ ਹਨ:

• ਇਹ ਯਕੀਨੀ ਸਲਾਇਡ ਯੂਨਿਟ ਤੇ ਸੱਜਾ ਪਲ ਸਲਾਇਡ (ਜ ਤਸਵੀਰ ਸਮੱਗਰੀ ਨੂੰ) 'ਤੇ ਕੇਵਲ ਇੱਕ ਹੀ ਵੇਖਾਉਦਾ ਹੈ, ਜੋ,, ਅਤੇ ਬਾਕੀ ਦੇ ਲੁਕੇ ਹੋਏ ਸਨ ਬਣਾਉਣ;
• ਸਲਾਇਡ ਹੋਰ (ਸੱਜੇ ਕਰਨ ਲਈ ਛੱਡ ਦਿੱਤਾ) ਦੇ ਬਾਅਦ ਇੱਕ ਦਾ ਪ੍ਰਬੰਧ;
• ਉਲ-ਕੰਟੇਨਰ ਹੈ, ਜੋ ਕਿ ਚੱਲ (ਖੱਬੇ ਅਤੇ ਸੱਜੇ) ਸਲਾਈਡ ਸਟੋਰ ਕਰਦੇ ਹਨ.

ਇਹ ਕਰਨ ਲਈ, CSS-ਫਾਇਲ ਵਿੱਚ ਹੇਠ ਚੋਣ ਸੈੱਟ ਕੀਤਾ:

• ਸਲਾਇਡ ਲਈ: ਓਵਰਫਲੋ-X - ੋਲ ਕਰੋ, ਓਵਰਫਲੋ-y - ਓਹਲੇ:
• ਉਲ ਲਈ: ਫਲੋਟ - ਛੱਡ ਦਿੱਤਾ.

ਵੀ ਤੁਹਾਨੂੰ ਇਸ ਲਈ ਬਾਹਰ ਦੀ ਚੌੜਾਈ ਦੇ ਪੈਰਾਮੀਟਰ (ਚੌੜਾਈ), ਉਚਾਈ (ਉਚਾਈ), ਦੀ ਪਿੱਠਭੂਮੀ (ਪਿਛੋਕੜ) ਅਤੇ ਸੈੱਟ ਕਰ ਸਕਦੇ ਹੋ.

ਸਾਨੂੰ ਜੇਕਉਐਰੀ ਵਿੱਚ ਇਹ ਕੋਡ ਪਾ

ਅਤੇ CSS ਸਾਰੇ ਜ਼ਰੂਰੀ ਬਦਲਾਅ ਕੀਤੇ ਗਏ ਹਨ. ਇਹ ਜੇਕਉਐਰੀ ਕੋਡ, ਸਲਾਈਡਰ ਹੈ, ਜੋ ਹੇਠਲੇ ਪੈਰਾਮੀਟਰ ਹੋਣਾ ਚਾਹੀਦਾ ਹੈ ਕੇਸ ਰਹਿੰਦਾ ਹੈ:

• ਸਲਾਇਡ ਇੱਕ ਨੂੰ ਕੁਝ ਵਾਰ ਅੰਤਰਾਲ ਦੇ ਨਾਲ ਇਕ-ਦੂਜੇ ਨੂੰ ਸਫ਼ਲ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ;
• ਤੁਹਾਨੂੰ ਕੀ ਸਬੰਧ ਉੱਤੇ ਮਾਊਸ ਸੰਕੇਤਕ ਨੂੰ ਆਪਣੇ ਅੰਦੋਲਨ ਨੂੰ ਖ਼ਤਮ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ.

slidewidth ਅਤੇ slidertime (ਸਲਾਇਡ ਦੀ ਲੰਬਾਈ ਦੇ ਬਰਾਬਰ) (ਇਹ ਨਿਰਧਾਰਤ ਕਰਦੀ ਹੈ ਸਲਾਈਡ ਸ਼ੋਅ ਦੀ ਮਿਆਦ): ਇਹ ਕਰਨ ਲਈ, ਸਾਨੂੰ ਦੋ ਵੇਰੀਬਲ ਐਲਾਨ. ਟਾਈਮਰ ਸ਼ੁਰੂ ਹੋ ਜਾਵੇਗਾ, ਜਦ ਸਫ਼ਾ ਪੂਰੀ ਲੋਡ ਸਾਈਟ ਹੈ. ਇਹ ਪੈਰਾਮੀਟਰ ਕੇ ਸਾਨੂੰ ਇੱਕ ਸਲਾਇਡ (ਜਿਸ ਨੂੰ ਸਲਾਈਡ ਸ਼ੋਅ ਰੁਕ) ਕਰਨ ਲਈ ਮਾਊਸ ਸੰਕੇਤਕ ਪੁਆਇੰਟਿੰਗ ਦੀ ਕਾਰਵਾਈ ਦੀ ਟਾਈ.

ਉਲ ਕੰਟੇਨਰ ਦੀ ਲੰਬਾਈ ਦਾ ਨੁਸਖ਼ਾ ਕਰਨ ਲਈ ਇਹ ਯਕੀਨੀ ਰਹੋ. ਇਹ ਸਲਾਈਡ ਦੀ ਗਿਣਤੀ, ਹਰ ਸਲਾਈਡ ਦੀ ਲੰਬਾਈ ਗੁਣਾ ਦੇ ਬਰਾਬਰ ਹੋ ਜਾਵੇਗਾ.

ਫੰਕਸ਼ਨ ਸਲਾਇਡ ਨੂੰ ਬਦਲਣ ਲਈ ਜ਼ਿੰਮੇਵਾਰ ਪਾਓ. ਜੋ ਕਿ ਸਭ ਨੂੰ ਹੈ, ਤੁਹਾਨੂੰ ਆਪਣੇ ਸਲਾਇਡਰ ਦੇ ਪ੍ਰਦਰਸ਼ਨ ਦੀ ਚੈੱਕ ਕਰ ਸਕਦਾ ਹੈ.

ਸਿੱਟਾ

ਇਸ ਲੇਖ ਵਿਚ ਸਾਨੂੰ ਇਸ ਦੀ ਵੈੱਬਸਾਈਟ ਦੇ ਇੱਕ ਸਫ਼ਾ ਸ਼ਾਮਲ ਕਰਨ ਲਈ ਆਪਣੇ ਖੁਦ ਦੇ ਜੇਕਉਐਰੀ-ਸਲਾਈਡਰ ਨੂੰ ਬਣਾਉਣ ਲਈ 'ਤੇ ਦੇਖਿਆ. ਇੱਕ ਸਧਾਰਨ ਸਲਾਇਡਰ ਦੀ ਮਿਸਾਲ ਦਾ ਇਸਤੇਮਾਲ ਕਰਕੇ, ਤੁਹਾਨੂੰ ਇਸ ਦੀ ਆਪਣੇ ਹੀ ਵਿਆਖਿਆ ਨਾਲ ਹੀ ਆਏ ਹਨ, ਸਰੋਤ ਕੋਡ ਨੂੰ ਉਚਿਤ ਤਬਦੀਲੀ ਕਰਨ. ਇਹ ਡਿਜ਼ਾਇਨ ਵਿੱਚ ਸੁਧਾਰ ਅਤੇ ਆਪਣੇ ਸਾਈਟ ਦੀ ਵਰਤੋ ਹੋਰ ਸੈਲਾਨੀ ਲਈ ਵਧੀਆ ਬਣਾਉਣ ਜਾਵੇਗਾ.