آموزش ساخت منو گرافیکی " نیازمندیم "

Shouli

Shouli

Active Member
با سلام :
من توی فروم هرچی گشتم این آموزشو پیدا نکردم , میخواستم یه منو درست کنم که این شکلی باشه !

25oyzk3.jpg

میخوام موس رو روی دکمه نگه دارم دکمه رنگش عوض بشه , توی فرانت پیج چنین چیزی هست ولی اصلا گرافیکی نیستن . من توی فوتوشاپ دکمه طراحی کردم ولی میخوام توی فرانت پیج بزارمش نمیتونم چنین کاری کنم !! لطفا کمک کنید .

یعنی مشکل اصلی من توی فرانت پیج هست, بلد نیستم انجام بدم

با تشکر
 
echessdesign

echessdesign

مدیر انجمن طراحی وب
با CSS هممی توانید
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>echessdesign</title>
<style type="text/css">
body {
	margin:20px;
}
a:link, a:visited {
	text-decoration:none;
	border:0;
	border-top:3px green solid;
	font:normal bold 9pt tahoma, arial;
	color:#000;
	padding:4px 0 0 0;
}
a:hover {
	text-decoration:none;
	border-top:3px lime solid;
}
</style>
</head>

<body>

<a href="www.echessdesign.com">echessdesign.com</a>
</body>

</html>
 
Shouli

Shouli

Active Member
با تشکر از شما دوست عزیز :
ببینید میخواستم وقتی روی عکس با موس بایستید عکس این شکلی بشه ...
!2.jpg

 
echessdesign

echessdesign

مدیر انجمن طراحی وب
بفرمایید:
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>echessdesign.com</title>
<style type="text/css">
a:link, a:visited {
	display:block;
	width:193px;
	height:168px;
	background:transparent url('pic1.jpg') no-repeat;
	text-decoration:none;
}
a:hover {
	background:transparent url('pic1.jpg') no-repeat;
	text-decoration:none;

}
</style>
</head>

<body>

</body>

</html>
 
Shouli

Shouli

Active Member
با تشکر از شما دوست عزیز : ولی نمیشه Css نباشه ! خدا وکیلی هر کاری کردم نتونستم بفهمم, یه چیزه دمه دست و خوب که به کارم بیاد, ببخشید .
توی فرانت پیج هم بشه راحت باش ور رفت

با تشکر
 
echessdesign

echessdesign

مدیر انجمن طراحی وب
ارادتمندم دوست عزیز
متاسفانه بدون کمک Css امکان پدیر نیست...
 
shnoit

shnoit

Well-Known Member
فکر کنم این شیوه اسونتره. البته توی یکی از قالبهای مانستر دیدم.
CSSشم ساده کار شده:

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#roll {background-image:url(images/m1r.jpg)}
#out {background-image:url(images/m1.jpg)}
#roll1 {background-image:url(images/m2r.jpg)}
#out1{background-image:url(images/m2.jpg)}
#roll2 {background-image:url(images/m3r.jpg)}
#out2 {background-image:url(images/m3.jpg)}
#roll3 {background-image:url(images/m4r.jpg)}
#out3 {background-image:url(images/m4.jpg)}
#roll4 {background-image:url(images/m5r.jpg)}
#out4 {background-image:url(images/m5.jpg)}
</style>

</head>

<body>
<div style="height:101px">
<TABLE WIDTH=499 height="101" BORDER=0 CELLPADDING=0 CELLSPACING=0>
	<TR>
		<TD WIDTH=100 HEIGHT=101 ALT="" valign="top" id="out" onMouseOut="this.id='out';" onMouseOver="this.id='roll';">
		</TD>
		<TD WIDTH=100 HEIGHT=101 ALT="" valign="top" id="out1" onMouseOut="this.id='out1';" onMouseOver="this.id='roll1';">
		</TD>
		<TD WIDTH=100 HEIGHT=101 ALT="" valign="top" id="out2" onMouseOut="this.id='out2';" onMouseOver="this.id='roll2';">
		</TD>
		<TD WIDTH=100 HEIGHT=101 ALT="" valign="top" id="out3" onMouseOut="this.id='out3';" onMouseOver="this.id='roll3';">
		</TD>
		<TD WIDTH=99 HEIGHT=101 ALT="" valign="top" id="out4" onMouseOut="this.id='out4';" onMouseOver="this.id='roll4';">
		</TD>
	</TR>
</TABLE>
</div>
</body>
</html>
اینم عکسهاش :)
 

پیوست ها

  • images.zip
    32.4 کیلوبایت · بازدیدها: 3
آخرین ویرایش:
shnoit

shnoit

Well-Known Member
این یکی رو هم نگاه بندازی بدک نیست.
این دیگه بدون css هست:)

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body leftmargin="0" topmargin="0" rightmargin="0" bottommargin="0" onLoad="MM_preloadImages('images/b2r.gif','images/b3r.gif','images/b4r.gif','images/b5r.gif','images/b6r.gif','images/b7r.gif')" bgcolor="F0F0F0">
<table>
  <tr>
    <td background="images/b8.gif"><img src="images/b1.gif"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','images/b2r.gif',1)"><img src="images/b2.gif" name="Image3" width="73" height="45" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','images/b3r.gif',1)"><img src="images/b3.gif" name="Image4" width="97" height="45" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','images/b4r.gif',1)"><img src="images/b4.gif" name="Image5" width="119" height="45" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','images/b5r.gif',1)"><img src="images/b5.gif" name="Image6" width="95" height="45" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','images/b6r.gif',1)"><img src="images/b6.gif" name="Image7" width="115" height="45" border="0"></a><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/b7r.gif',1)"><img src="images/b7.gif" name="Image8" width="103" height="45" border="0"></a></td>
  </tr>
</table>
</body>
</html>
اینم عکسهای منو:wink:
موفق باشین
 

پیوست ها

  • images.zip
    17.8 کیلوبایت · بازدیدها: 2
S

seeemesooo

New Member
مي خام يك صفحه وب داشته باشم كه يك سري عكس 4 كيلو بايتي قرار بدم با سايز هاي يك اندازه بطوري كه وقتي روي آن كليك كنند عكس با ابعاد بزرگ نمايش داده شود از چه برنامه اي استفاده كنم
 
roozshop

roozshop

Member
احتیاج به برنامه ای نیست
به راحتی عکسهای 4 کیلوبایتی رو لینک کن به عکسهای بزرگ .
وقتی روشون کلیک بشه توی یه صفحه وب تصویر بزگه نمایش داده میشه .
با هر ویرایشگر متن یا هر ویرایشگر وب ویژوالی ( مثلا فرانت پیج ) میتونی این کارو انجام بدی
 
S

seeemesooo

New Member
من مبتدي هستم يه ويرايشگروب ویژوالی معرفي كنيد مي خواهم به صورت يك صفحه وب آپلود كنم مبداء عكس هاي بزرگ را چطور تو فايلي كه با وب سيو از ميكنم قرار دهم
 
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا