sdns

سوالی در مورد css

9 پست در این موضوع

ارسال شده در (ویرایش شده)

بذارین سوالم رو خیلی ساده بپرسم:

فرضا من دو تا لایه دارم که لایه شماره 2 داخل لایه شماره 1 باشه

می خوام وقتی ماوس روی لایه شماره 1 بره ، لایه شماره 2 مثلا رنگش عوض شه(یا هر چیزه دیگه ای)

این کار رو چه جوری می شه کرد؟

برای بهتر نشون دادن منظورم یه عکس آپلود کردم

47265765638316798569.jpg

ویرایش شده در توسط sdns
افزودن عکس

Share this post


Link to post
Share on other sites
آموزش ووکامرس قالب جوملا قالب وردپرس قالب رایگان وردپرس قالب رایگان جوملا هاست نامحدود هاست جوملا هاست لاراول هاست وردپرس هاست ارزان هاست ربات تلگرام خرید دامنه آموزش ساخت ربات تلگرام با php آموزش لاراول آموزش cPanel آموزش php آموزش فرم ساز RSform آموزش ساخت ربات جذب ممبر آموزش ساخت ربات دوستیابی آموزش ساخت ربات فروشگاهی برای ووکامرس آموزش طراحی سایت داینامیک با php آموزش بخش پشتیبانی با rsticket

فک نکنم با css بشه اینکارو کرد. چون نیاز به دستور شرطی داره که وقتی موس روی یک موقعیته استایل یک موقعیت دیگر تغییر کنه.

Share this post


Link to post
Share on other sites

با jquery می تونی این کار رو بکنی . بزار کامل برات بگم :

تو تگ <head> اینارو بنویس :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script type="text/javascript">

// پارامتر جی کوئری

uc = jQuery.noConflict();

uc(document).ready(function(){

uc("#layer1").hover(function(){

uc("#layer2").css("background-color","blue");

});

});

Share this post


Link to post
Share on other sites
ببین اون قبلی رو فراموش کن از این فایلی که دادم استفاده کن :

Untitled-3 دانلود ● آپلود سنتر انجمن جوملای ایران

یاعلی

ممنون دوست عزیز بابت راهنمایی تون و فایلی که زحمت کشیدین قرار دادین.

فقط در این فایل این کار یک بار انجام می شه.من می خوام هر بار که با ماوس می یاد روش رنگش عوض بشه و وقتی می ره کنار رنگش به حالت قبلی برگرده. و دقعه بعد که دوباره می یاد روش رنگش عوض شه و الی آخر ...

قبلا یه جا دیده بودم این رو ولی اصلا یادم نمی یاد کجا.فکر می کنم اونجا با استفاده از اسم تگ های css این کار رو کرده بودن. یعنی با استفاده از html و css و بدون جی کوئری. آیا هم چین چیزی ممکنه؟ یا من اشتباه یادم می یاد؟

فکر کنم این جوری بود که وقتی می یای روی تگ leyer1 اون موقع layer2 رو تغییر می داد. مثلا می گم یه کدی با ساختار زیر:

.layer1:hover => layer2{

background:red;

}

به جای => یه چیزه دیگه بود فکر کنم. آیا یه هم چین کدی توی css هست؟ یا اینکه باز من اشتباه یادم می یاد؟ :21:

Share this post


Link to post
Share on other sites
ممنون دوست عزیز بابت راهنمایی تون و فایلی که زحمت کشیدین قرار دادین.

فقط در این فایل این کار یک بار انجام می شه.من می خوام هر بار که با ماوس می یاد روش رنگش عوض بشه و وقتی می ره کنار رنگش به حالت قبلی برگرده. و دقعه بعد که دوباره می یاد روش رنگش عوض شه و الی آخر ...

قبلا یه جا دیده بودم این رو ولی اصلا یادم نمی یاد کجا.فکر می کنم اونجا با استفاده از اسم تگ های css این کار رو کرده بودن. یعنی با استفاده از html و css و بدون جی کوئری. آیا هم چین چیزی ممکنه؟ یا من اشتباه یادم می یاد؟

فکر کنم این جوری بود که وقتی می یای روی تگ leyer1 اون موقع layer2 رو تغییر می داد. مثلا می گم یه کدی با ساختار زیر:

.layer1:hover => layer2{

background:red;

}

به جای => یه چیزه دیگه بود فکر کنم. آیا یه هم چین کدی توی css هست؟ یا اینکه باز من اشتباه یادم می یاد؟ :21:

بله این کد درسته و من خودم هر موقع بخوام همچین کاری کنم از این کد استفاده میکنم

عبارت "=>" زیاد مهم نیست و میتونید حتی به جای اون یه فاصله بزنید.

این کد زمانی جواب میده که layer2 زیر مجموعه ی layer 1 باشه و این دستور رو میده : وقتی که موس روی layer1 رفت روی layer2 این کار رو انجام بده

حتی اینطوری میشه یک منوی html و css ساده ساخت.

Share this post


Link to post
Share on other sites

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sample Test</title>
<style>
	#layer1 {
		background: #00F ;
		width: 600px;
		height: 500px;
		margin: 0 auto;
	}
	#layer2 {
		background: #FF0 ;
		width: 200px;
		height: 200px;
		margin: 0 auto;
	}

	#layer1:hover #layer2 {
		background: #000;
	}

</style>
</head>
<body>
<div id="layer1">
	<div id="layer2"></div>
</div>
</body>
</html>

موفق باشید gift

Share this post


Link to post
Share on other sites

دوستان به خوبی توضیح دادن ولی در کل شما باید این کارو انجام بدین

برای مثال دو تا دایو layer1 و layer2 داریم که layer2 داخل layer 1 هست به این طریق :

<div class="layer1">
<div class="layer2">
</div>
</div>

برای اینکه بتونید به دایوی که داخل دایو دیگه هست استایل بدین به طور کلی از این جور کد دهی استفاده میشه .layer1 . layer2 و اگر بخواین با اومدن روی دایو اول ، دایو دوم تغییر رنگ بده از کد زیر استفاده کنید :

.layer1:hover .layer2{
background:#CCC;
}

Share this post


Link to post
Share on other sites

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری