PDA

View Full Version : تغییر یک عکس هنگام Hover شدن



AhoO-sh
شنبه 21 فروردین 1389, 11:16 صبح
سلام دوستان
چطور میشه یه لینک داشت که وقتی روش می ریم مثلا یک Image که در صفحه است تغییر پیدا کنه و وقتی روش کلیک میکنیم به صفحه دیگه بره
البته منظور من یه چیزی شبیه همون Hover لینک است


یا مثلا وقتی روی لینک های Tree میرم اون عکس صفحه عوض بشه

z_bluestar
شنبه 21 فروردین 1389, 11:27 صبح
اين كــارها اصولا با JavaScript , J query انجــام مي دن .

با Client Event هـا .
مثلا مي تونيد از لينك شروع كنيد .

<a href="test.aspx" onmouseover="style.color= 'orange'; style.textDecoration = 'underline';"
onmouseout="style.color= '#666666';style.textDecoration = 'none'"
style="color: #666666; text-decoration: none">this is an example</a>

AhoO-sh
شنبه 21 فروردین 1389, 11:38 صبح
مرسی
ولی من میخوام Image که درصفحه دارم عکسش تغییر پیدا کنه

Peyman.Gh
شنبه 21 فروردین 1389, 11:49 صبح
فکر کنم منظور شما این باشد :


<a href="./YourPage.html" onmouseover="SetImage('Image1','images/2.jpg');return false;" onmouseout="SetImage('Image1','images/1.jpg');return false;"><img src="/images/1.jpg" id="Image1" alt="" align="top" border="0" style="width:128px;height:128px;"></a>موفق باشید.

z_bluestar
شنبه 21 فروردین 1389, 11:54 صبح
تو اينترنت Search كنيد پيدا مي كنيد . تو onmouseover مي تونيد Background صفحه تون رو عوض كنيد .

<html>
<head>
<style>
#Good {
background-repeat: no-repeat;
background-position: center center;
background-image: url(images/image40.gif);
}
</style>
<script>
<!--
function changeImage() {
newImage = "url(images/image41.gif)";
document.getElementById('Good').style.backgroundIm age = newImage;
}
//-->
</script>
</head>
<body>
<table>
<tr>
<td id="Td1"><br>Hopefully there is a nice picture behind me :P</td>
</tr>
<tr>
<td><a href="#" onmouseover="changeImage()">sample text</a>><td>
</table>
</body>
</html>

AhoO-sh
شنبه 21 فروردین 1389, 13:11 عصر
مرسی دوستان

من می خوام یه چیزی مثل این سایت داشته باشم

http://www.siemens-home.co.uk/

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

z_bluestar
شنبه 21 فروردین 1389, 13:15 عصر
طريقه انجـام شدن اين كـار رو بهت گفتيم ، ديگه بقيش با خودته .
چون كدش همينه .
حآلا تو متناسب با نيازت مي توني تغييرش بدي

Peyman.Gh
شنبه 21 فروردین 1389, 14:11 عصر
منظور شما این هست که یک عکس داشته باشید وقتی موس روی آن رفت تغییر کند ؟!

meisam3322
پنج شنبه 16 اردیبهشت 1389, 08:26 صبح
بابا اين بنده خدا فايل فلش ديده ميگه عكس...................بي خيال

alireza_s_84
پنج شنبه 16 اردیبهشت 1389, 09:29 صبح
سلام دوستان
چطور میشه یه لینک داشت که وقتی روش می ریم مثلا یک Image که در صفحه است تغییر پیدا کنه و وقتی روش کلیک میکنیم به صفحه دیگه بره
البته منظور من یه چیزی شبیه همون Hover لینک است
یا مثلا وقتی روی لینک های Tree میرم اون عکس صفحه عوض بشه
سلام اگه میخوای یه لینک داشته باشی که وقتی موس رفت روش فقط باید دو تا کلاس سی اس اس براش تعریف کنی همین:

<style type="text/css">
.test
{
text-decoration: none;
background-image: url('عکس حالت عادی');
display: block;
width: 40px;
height: 40px;
}
.test:hover
{
text-decoration: underline;
background-image: url('عکس حالت موس اور');
}
</style>
<a href="#" class="test">aaa</a>

نیازی به جاوا اسکریپت نیست
موفق باشید