تغییر شکل Botton (در موتور سرچ)

Ali 59

Well-Known Member
سلام

من با یه نرم افزار یه موتور سرچ آماده درست کردم حالا میخوام شکل دکمه شو به حالت دلخواهم تغییر بدم (یعنی عکس بیاد جاش با کارآیی دکمه ) .. مثلا این :

29mrvvc.jpg


سپاس
 
آخرین ویرایش:

Ali 59

Well-Known Member
بسیار عالی... حالا میخوام همین عکس Swap بشه وقتی موس میاد روش.. آیا راهی داره یا نمیشه؟

بازم ممنون
 

echessdesign

مدیر انجمن طراحی وب
ارادتمندم علی جان
شما می تونی از جاوا اسکریپت استفاده کنی:
در ابتدا Input رو مقدار دهی می کنید، سپس class برای زمانی که موس بر روی آن می رود تعریف می کنیم:
HTML:
<style type="text/css">
input {
	background:red url('Alfa-R_147-Murphy-Nye_138_1280x800.jpg') ;
}
.sawpInput {
	background: black url('bioheader_012.jpg') ;
}
</style>
////////////////////////////////
سپس آن را درتگ Input اعمال می کنیم:
HTML:
<form action="">
<input type="submit" value="submit" onmouseover="this.className='sawpInput'" onmouseout="this.className=''" />
</form>
نیاز به توضیح بیشتری بود بفرمایید.
پاینده باشید.
 

Ali 59

Well-Known Member
چاکریم حسین جان ... دستت درد نکنه کاملا واضح بود.. حالا به یه مشکل دیگه برخوردم! اونم اینه :

where-the-hell-is-the-Botto.jpg


ملاحظه میکنید که این موتور سرچ لعنتی دکمه رو تو حالت Design به من نمیده... تو کد هم خبری از کد دکمه نیست تا بهش دسترسی داشته باشم

موتور سرچ = Zoom Search Engine

کد:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--
Example search page for the JavaScript install of Zoom Search Engine 5.0

NOTE: that you should only use the JavaScript version if server-side
processing is not available, such as on a CD-ROM, local intranet, etc.

Client-side searching requires the entire index file to be downloaded
to the client, which is not an issue locally, or if your website is small,
but can be very slow for larger websites, over the Internet.

Hints:
1. Make sure you have indexed your website with the Zoom Indexer application
   with the "Javascript" option checked in the Configuration dialog. It
   should produce a file named "zoom_index.js" in your selected output directory.
2. Put this file (search.html), search.js, and zoom_index.js in the same directory
3. Copy or upload these files to your distribution medium (CD, server, etc)
3. Customise this page as you see fit. You can also put a search form on the
   other pages of your site (or navbar) by copying the form below.
-->
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1252" />
	<title>Example search page for Zoom Search Engine (JavaScript version)</title>
	<script language="JavaScript" src="settings.js"></script>
	<script language="JavaScript" src="search.js"></script>
	<!-- You can change the fonts, text colors, and styles of your search results with the CSS below -->
	<style type="text/css">
		.highlight { background: #FFFF40; }
		.searchheading { font-size: 130%; font-weight: bold; }
		.summary { font-size: 80%; font-style: italic; }
		.suggestion { font-size: 100%; }
		.results { font-size: 100%; }
		.category { color: #999999; }
		.sorting { text-align: right; }

		.result_title { font-size: 100%; }		
		.description { font-size: 100%; color: #008000; }
		.context { font-size: 100%; }
		.infoline { font-size: 80%; font-style: normal; color: #808080;}

		.zoom_searchform { font-size: 100%; }
		.zoom_results_per_page { font-size: 80%; margin-left: 10px; }
		.zoom_match { font-size: 80%; margin-left: 10px;}				
		.zoom_categories { font-size: 80%; }
		.zoom_categories ul { display: inline; margin: 0px; padding: 0px;}
		.zoom_categories li { display: inline; margin-left: 15px; list-style-type: none; }

		input.zoom_button {  }
		input.zoom_searchbox {  }		
		
		.result_image { float: left; display: block; }
		.result_image img { margin: 10px; width: 80px; border: 0px; }

		.result_block { margin-top: 15px; margin-bottom: 15px; clear: left; }
		.result_altblock { margin-top: 15px; margin-bottom: 15px; clear: left; }
		
		.result_pages { font-size: 100%; }
		.result_pagescount { font-size: 100%; }
		
		.searchtime { font-size: 80%; }
		
		.recommended 
		{ 
			background: #DFFFBF; 
			border-top: 1px dotted #808080; 
			border-bottom: 1px dotted #808080; 
			margin-top: 15px; 
			margin-bottom: 15px; 
		}
		.recommended_heading { float: right; font-weight: bold; }
		.recommend_block { margin-top: 15px; margin-bottom: 15px; clear: left; }		
		.recommend_title { font-size: 100%; }
		.recommend_description { font-size: 100%; color: #008000; }
		.recommend_infoline { font-size: 80%; font-style: normal; color: #808080;}
	</style>		    
</head>

<body>
	<h1>Search this site</h1>
	<p>
	Enter one or more keywords to search for using the Zoom Search Engine.<br />
	Note that '*' and '?' wildcards are supported.
	</p>
	<!-- This is where the search form and results will appear -->
	<script language="JavaScript">ZoomSearch();</script>
	<noscript>You must have JavaScript enabled to use this version of the search engine.</noscript>
</body>
</html>
 
آخرین ویرایش:

echessdesign

مدیر انجمن طراحی وب
درود بر شما
ارادتمندم علی جون، چون bottun در صفحه نیست، یک نمایش Previw از صفحه بگیر که در آن دکمه نمایش داده شده باشد، سپس صفحه رو ذخیره کن (Save as)، سپس اون رو ضمیمه کن.
(به علت اینکه دکمه ای در صفحه نیست، در حالت پیش فرض، معلوم نیست که کدوم Style به دکمه اعمال شده).
پاینده باشید.
 

echessdesign

مدیر انجمن طراحی وب
علی جان، خودت این فایل رو تست گرفتی؟
متاسفانه من دکمه ای رو زمان نمایش نمی بینم...
لطفا زمان زخیره کردن، Html زخیره کن.
پاینده باشید.
 

Ali 59

Well-Known Member
عذرمیخوام بله حق با شماست ..بار اول که تستش کردم نشون میداد اما الان دوباره تست کردم چیزی نشون نمیده خیلی عجیبه! ... عکسشم تو پست 5 گذاشته بودم ظاهرا از دیتابیس سایت پاک شده.. این عکسشه در حالت Preview و Design در Front Page :

optwg4.jpg


Html هم سیو کردم باز هم دکمه رو نشون نمیداد بنابراین یه سرچ دیگه تو یه وب جدید درست کردم و همه فایلهاش رو ضمیمه کردم :

مشاهده پیوست mysite.zip

سپاس فراوان
 
اسم کلاسش zoom_button هست

توی استایل صفحه دنبال این کلاس بگرد
کد:
input.zoom_button {  }
و اونو به این تغییر بده
کد:
		input.zoom_button {background:red url('Alfa-R_147-Murphy-Nye_138_1280x800.jpg'); border:0;}

و اگر می خوای swap بشه باید این کد رو
کد:
        document.writeln("<input type=\"submit\" value=\"" + STR_FORM_SUBMIT_BUTTON + "\" class=\"zoom_button\" />");
که در خط 347 از فایل search.js هست رو به این کد
کد:
        document.writeln("<input type=\"submit\" value=\"" + STR_FORM_SUBMIT_BUTTON + "\" class=\"zoom_button\" onmouseover=\"this.className='sawpInput'\" onmouseout=\"this.className='zoom_button'\"/>");
تغییر بدی
و این کلاس رو به کدهات اضافه کن
کد:
		input.sawpInput {background: black url('bioheader_012.jpg') ;border:0;}




اقا حسین عزیز ارادتمندم
وقتی می خوایم یه دکمه رو براش بکگروند بزاریم باید حاشیه یا همون بوردر اون رو صفر کنیم وگرنه بوردر اون میمونه و کار رو زشت میکنه


فایل های تصحیح شده رو گذاشتم
 

پیوست ها

  • mysite.zip
    12.9 کیلوبایت · بازدیدها: 2
آخرین ویرایش:

Ali 59

Well-Known Member
ایوالله!! . ...

جناب محسنی و حسین عزیز کمال تشکر و روبعمل میارم... خیلی لطف کردید.


تنها یه مشکل دیگه مونده اونم اگه اجازه بدید عرض کنم:

میخوام نتایج سرچ بجای اینکه زیر تکست باکس ردیف بشن ؛ در یک فریم مجزای دیگه لود بشه... آیا امکان چنین کاری برای این موتور وجود داره ؟


سپاسگزارم
 
آخرین ویرایش:

echessdesign

مدیر انجمن طراحی وب
اراد تمندم علی جان
اگر دیر جواب دادم به این علت هست که اطلاعات جالبی از JS ندارم و منتظر مرتضی بودم که جواب بده...
شما مقدار
HTML:
target=\"framename\"
رو به تگ input فایل JS خودت اضافه کنی.
منظور از framename، همون نام فریم شماست که قرار است نتایج جستجو در آن مشاهده شود.
اگر مشکل حل نشد بفرمایید.
پاینده باشید.
 
آخرین ویرایش:
شما مقدار
کد HTML:
target=\"framename\"
رو به تگ input فایل JS خودت اضافه کنی.
به تگ اینپوت نه ، باید به تگ فرم اضافه کنید

توی فایل search.js خط 345 این کد رو
کد:
document.writeln("<form method=\"get\" action=\"" + SelfURL + "\" class=\"zoom_searchform\">");
با این کد
کد:
document.writeln("<form method=\"get\" action=\"" + SelfURL + "\" class=\"zoom_searchform\" target=\"framename\">");
عوض کن
البته با این کار کل صفحه رو توی فریم با اسم framename لود میکنه که باعث میشه کار زشت در بیاد
شما می تونی نتیجه جستجو رو توی یه صفحه جدید ارائه بدی که برای این کار به جای framename باید _blank بنویسی
به این صورت
کد:
document.writeln("<form method=\"get\" action=\"" + SelfURL + "\" class=\"zoom_searchform\" target=\"_blank\">");

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

Ali 59

Well-Known Member
بله متوجه هستم... تا همینجا هم خیلی لطف کردید و کلی کارم راه افتاد... باز هم ممنونم
 
آخرین ویرایش:

Ali 59

Well-Known Member
یه موتور سرچ دیگه پیدا کردم به نام Search Engine Composer که براحتی نتایج سرچو در یک صفحه مجزا نمایش میده و راحت میشه هر بلایی بخوای سرش در بیاری... تنها ایرادش اینه که بدون کرک 10 تا فایل بیشتر ایندکس نمیکنه..
(هر چی گشتم کرک سالم پیدا نکردم!)
 

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

بالا