الگو:کانتینر اسلایدر و پس زمینه - تاریخچهٔ نسخه‌ها

Javid در ‏۱۸ اوت ۲۰۲۶، ساعت ۱۲:۵۷

2026-08-18T12:57:19Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۸ اوت ۲۰۲۶، ساعت ۱۲:۵۷
خط ۱:		خط ۱:

	<html>		<html>

خط ۹۲:		خط ۹۱:
	</article>		</article>

	<!-- کارت 6 -->		<!-- کارت 6 -->
	<article class="yasheel-card">		<article class="yasheel-card">
	<a href="#" aria-label="طراحی اختصاصی کابینت یاشیل">		<a href="#" aria-label="طراحی اختصاصی کابینت یاشیل">
خط ۱۰۵:		خط ۱۰۴:
	</article>		</article>

	<!-- کارت 7 -->		<!-- کارت 7 -->
	<article class="yasheel-card">		<article class="yasheel-card">
	<a href="#" aria-label="طراحی اختصاصی کابینت یاشیل">		<a href="#" aria-label="طراحی اختصاصی کابینت یاشیل">
خط ۱۱۷:		خط ۱۱۶:
	</a>		</a>
	</article>		</article>


	</div>		</div>
خط ۲۴۱:		خط ۲۳۹:

	.yasheel-card{		.yasheel-card{
	flex:0 0 ~~calc((~~100% ~~- 12px) / 2)~~;		/* موبایل: یک کارت */
			flex:0 0 100%;

	scroll-snap-align:start;		scroll-snap-align:start;
خط ۴۵۲:		خط ۴۵۱:
	function visibleCards(){		function visibleCards(){

			/* موبایل: یک کارت */
	if(window.innerWidth < 600){		if(window.innerWidth < 600){
	return 2;		return 1;
	}		}

خط ۵۱۱:		خط ۵۱۱:

	const move = getMove();		const move = getMove();

	/*
	~~چون track راست به چپ است،~~
	~~مقدار scrollLeft باید منفی باشد.~~
	*/

	track.scrollTo({		track.scrollTo({
خط ۵۹۶:		خط ۵۹۱:

	}else{		}else{

	/*
	~~وقتی به آخر رسید،~~
	~~دوباره از اول شروع می شود.~~
	*/

	goToSlide(0);		goToSlide(0);
خط ۶۲۵:		خط ۶۱۵:

	}else{		}else{

	/*
	~~اگر در ابتدا بودیم،~~
	~~به آخر اسلایدر می رویم.~~
	*/

	goToSlide(max);		goToSlide(max);
خط ۶۳۷:		خط ۶۲۲:
	}		}
	);		);


			/* =====================================
			حرکت خودکار هر 3 ثانیه
			===================================== */

			setInterval(function(){

			const max = maxIndex();

			if(index < max){

			goToSlide(index + 1);

			}else{

			goToSlide(0);

			}

			},3000);


خط ۶۷۱:		خط ۶۷۷:
	}		}

	/*		/* در حالت RTL */
	در حالت RTL
	*/

	if(difference > 0){		if(difference > 0){

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۱۰:۰۳

2026-08-17T10:03:48Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۱۰:۰۳
خط ۷۳۳:		خط ۷۳۳:

	</html>		</html>
	~~```~~

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۱۰:۰۱

2026-08-17T10:01:58Z

@@ خط ۱: / خط ۱: @@
-```html
 <html>
@@ خط ۹۱: / خط ۹۱: @@
            </a>
          </article>
        </div>

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۹:۵۸

2026-08-17T09:58:42Z

نمایش تغییرات

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۴۱

2026-08-17T08:41:29Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۴۱
خط ۳۶:		خط ۳۶:
	<div class="yasheel-card-content">		<div class="yasheel-card-content">
	<h3>کابینت مدرن</h3>		<h3>کابینت مدرن</h3>
	~~<p>طراحی ساده و مدرن متناسب با فضای آشپزخانه</p>~~
	</div>		</div>
	</a>		</a>
خط ۴۹:		خط ۴۹:
	loading="lazy">		loading="lazy">
	<div class="yasheel-card-content">		<div class="yasheel-card-content">
	<h3>کابینت ~~نئوکلاسیک~~</h3>		<h3>کابینت اکریلیک</h3>
	~~<p>ترکیب زیبایی کلاسیک با طراحی مدرن</p~~>
	</div>		</div>
	</a>		</a>
خط ۶۴:		خط ۶۳:
	<div class="yasheel-card-content">		<div class="yasheel-card-content">
	<h3>کابینت کلاسیک</h3>		<h3>کابینت کلاسیک</h3>
	~~<p>طراحی چشم‌نواز با جزئیات و ظرافت بیشتر</p>~~
	</div>		</div>
	</a>		</a>
خط ۷۸:		خط ۷۶:
	<div class="yasheel-card-content">		<div class="yasheel-card-content">
	<h3>کابینت آشپزخانه</h3>		<h3>کابینت آشپزخانه</h3>
	~~<p>استفاده بهینه از فضا با طراحی اختصاصی</p>~~
	</div>		</div>
	</a>		</a>
خط ۹۲:		خط ۸۹:
	<div class="yasheel-card-content">		<div class="yasheel-card-content">
	<h3>طراحی اختصاصی</h3>		<h3>طراحی اختصاصی</h3>
	~~<p>طراحی کابینت متناسب با سلیقه و ابعاد فضای شما</p>~~
	</div>		</div>
	</a>		</a>
خط ۱۳۳:		خط ۱۲۹:
	background-position:top;		background-position:top;
	background-repeat:no-repeat;		background-repeat:no-repeat;
			border-radius:2%;
	padding:70px 10px 25px;		padding:70px 10px 25px;
	overflow:hidden;		overflow:hidden;
خط ۱۴۳:		خط ۱۳۹:
	inset:0;		inset:0;
	background:linear-gradient(		background:linear-gradient(
	to ~~center~~,		to bottom,
	rgba(0,0,0,.18),		rgba(0,0,0,.18),
	rgba(0,0,0,.30)		rgba(0,0,0,.30)
	);		);
	z-index:1;		z-index:1;
			border-radius:2%;
	}		}

خط ۲۰۵:		خط ۲۰۲:
	flex:0 0 calc((100% - 12px) / 2);		flex:0 0 calc((100% - 12px) / 2);
	scroll-snap-align:start;		scroll-snap-align:start;

	background:#fff;		background:#fff;
	border-radius:10px;		border-radius:10px;
	overflow:hidden;		overflow:hidden;
			transition:transform .25s ease;
	~~box-shadow:~~
	~~0 5px 20px rgba(0,0,0,.18);~~

	transition:transform ~~.25s ease,~~
	~~box-shadow~~ .25s ease;
	}		}

خط ۲۲۷:		خط ۲۱۸:
	display:block;		display:block;
	width:100%;		width:100%;
	aspect-ratio:1 / ~~.85~~;		aspect-ratio:1 / 2;
	object-fit:cover;		object-fit:cover;
	}		}

	.yasheel-card-content{		.yasheel-card-content{
	~~padding:12px 10px 14px;~~
	text-align:~~right~~;		text-align:center;
	}		}

خط ۳۵۸:		خط ۳۴۹:
	}		}

	.yasheel-card:hover{		/* .yasheel-card:hover{
	transform:translateY(-5px);		transform:translateY(-5px);
	box-shadow:		box-shadow:
	0 12px 30px rgba(0,0,0,.25);		0 12px 30px rgba(0,0,0,.25);
	}		}*/

	.yasheel-card-content{		.yasheel-card-content{
	padding:~~15px 14px 17px~~;		padding:2px 0 2px;
	}		}

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۲۵

2026-08-17T08:25:02Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۲۵
خط ۱۴۳:		خط ۱۴۳:
	inset:0;		inset:0;
	background:linear-gradient(		background:linear-gradient(
	to ~~bottom~~,		to center,
	rgba(0,0,0,.18),		rgba(0,0,0,.18),
	rgba(0,0,0,.30)		rgba(0,0,0,.30)
خط ۱۶۷:		خط ۱۶۷:
	}		}

	.yasheel-heading h2{		.yasheel-heading h2 h3{
	margin:0 0 8px;		margin:0 0 8px;
	font-size:28px;		font-size:28px;

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۱۷

2026-08-17T08:17:56Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۱۷
خط ۱۳۸:		خط ۱۳۸:
	}		}

	/* لایه روی عکس		/* لایه روی عکس */
	.yasheel-overlay{		.yasheel-overlay{
	position:absolute;		position:absolute;
خط ۱۴۸:		خط ۱۴۸:
	);		);
	z-index:1;		z-index:1;
	}*/		}

	/* عنوان روی تصویر */		/* عنوان روی تصویر */

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۱۶

2026-08-17T08:16:54Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۱۶
خط ۳۱:		خط ۳۱:
	<a href="#" aria-label="کابینت مدرن یاشیل">		<a href="#" aria-label="کابینت مدرن یاشیل">
	<img		<img
	src="https://dl.faraghaib.ir/m/260015/~~26001515~~.jpg"		src="https://dl.faraghaib.ir/m/260015-01/260015-01-15.jpg"
	alt="طراحی و اجرای کابینت مدرن یاشیل"		alt="طراحی و اجرای کابینت مدرن یاشیل"
	loading="lazy">		loading="lazy">
خط ۴۵:		خط ۴۵:
	<a href="#" aria-label="کابینت نئوکلاسیک یاشیل">		<a href="#" aria-label="کابینت نئوکلاسیک یاشیل">
	<img		<img
	src="https://dl.faraghaib.ir/m/260015/~~26001513~~.jpg"		src="https://dl.faraghaib.ir/m/260015-01/260015-01-13.jpg"
	alt="کابینت نئوکلاسیک یاشیل"		alt="کابینت نئوکلاسیک یاشیل"
	loading="lazy">		loading="lazy">
خط ۵۹:		خط ۵۹:
	<a href="#" aria-label="کابینت کلاسیک یاشیل">		<a href="#" aria-label="کابینت کلاسیک یاشیل">
	<img		<img
	src="https://dl.faraghaib.ir/m/260015/~~26001514~~.jpg"		src="https://dl.faraghaib.ir/m/260015-01/260015-01-14.jpg"
	alt="طراحی کابینت کلاسیک یاشیل"		alt="طراحی کابینت کلاسیک یاشیل"
	loading="lazy">		loading="lazy">
خط ۷۳:		خط ۷۳:
	<a href="#" aria-label="کابینت آشپزخانه یاشیل">		<a href="#" aria-label="کابینت آشپزخانه یاشیل">
	<img		<img
	src="https://dl.faraghaib.ir/m/260015/~~26001516~~.jpg"		src="https://dl.faraghaib.ir/m/260015-01/260015-01-16.jpg"
	alt="اجرای کابینت آشپزخانه یاشیل"		alt="اجرای کابینت آشپزخانه یاشیل"
	loading="lazy">		loading="lazy">
خط ۸۷:		خط ۸۷:
	<a href="#" aria-label="طراحی اختصاصی کابینت یاشیل">		<a href="#" aria-label="طراحی اختصاصی کابینت یاشیل">
	<img		<img
	src="https://dl.faraghaib.ir/m/260015/~~26001517~~.jpg"		src="https://dl.faraghaib.ir/m/260015-01/260015-01-17.jpg"
	alt="طراحی اختصاصی کابینت یاشیل"		alt="طراحی اختصاصی کابینت یاشیل"
	loading="lazy">		loading="lazy">
خط ۱۳۸:		خط ۱۳۸:
	}		}

	/* لایه روی عکس */		/* لایه روی عکس
	.yasheel-overlay{		.yasheel-overlay{
	position:absolute;		position:absolute;
خط ۱۴۸:		خط ۱۴۸:
	);		);
	z-index:1;		z-index:1;
	}		}*/

	/* عنوان روی تصویر */		/* عنوان روی تصویر */

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۱۴

2026-08-17T08:14:21Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۰۸:۱۴
خط ۱۲۹:		خط ۱۲۹:

	/* تصویر اصلی بزرگ */		/* تصویر اصلی بزرگ */
	background-image:url("https://dl.faraghaib.ir/m/260015/~~26001542~~.jpg");		background-image:url("https://dl.faraghaib.ir/m/260015-01/260015-01-42.jpg");
	background-size:cover;		//background-size:cover;
	background-position:~~center~~;		background-position:top;
	background-repeat:no-repeat;		background-repeat:no-repeat;

Javid در ‏۱۷ اوت ۲۰۲۶، ساعت ۰۶:۵۳

2026-08-17T06:53:19Z

→ نسخهٔ قدیمی‌تر		نسخهٔ ‏۱۷ اوت ۲۰۲۶، ساعت ۰۶:۵۳
خط ۱۲۹:		خط ۱۲۹:

	/* تصویر اصلی بزرگ */		/* تصویر اصلی بزرگ */
	background-image:url("https://dl.faraghaib.ir/m/260015/~~26001516~~.jpg");		background-image:url("https://dl.faraghaib.ir/m/260015/26001542.jpg");
	background-size:cover;		background-size:cover;
	background-position:center;		background-position:center;