PDA

View Full Version : سوال: استفاده از فایلهای htc در css ها



alirezaed
یک شنبه 19 اردیبهشت 1389, 17:12 عصر
با سلام، خسته نباشید،
بنده متوجه یک امکانی در ASP.NET 3.5 شدم که توسط اون آدم برای اینکه بتونه یه UI قوی درست کنه می تونه یه سری فایل های با پسوند htc داشته باشه که رفتارهای کنترل ها رو توی اون بنویسه.
من اطلاعاتی که دارم رو می زارم امیدوارم دوستان تکمیلش کنن و نواقصشو بگن چون خودم تازه کارم.
توی فایل style که برای برناممون (سایتمون) در نظر گرفتیم یک سری تگ هایی داریم که از اونها می تونیم برای یکسان سازی style یک سری کنترل استفاده کنیم مثل کد زیر:


body
{
font-family : Tahoma ;
font-size : 10pt;
}
.TextBox
{
font : tahoma;
border : solid1pxsilver;
font-size :8pt;
width:200px;

behavior


: {url(file.htc({


}

که در ساخت textbox ها می تونیم cssClass اون رو به TextBox تغییر بدیم تا همه اون textboxها، Style خودشون رو از این قطعه کدی که نوشتیم دریافت کنند.
کار غیر معمولی که اینجا دیده می شه اینه که به این Style یک خصوصیت به نام behavior اضافه شده که توی اون یک فایل htc نیز معرفی شده است. این فایل htc مربوط به کد جاوایی است که در هنگام رخدادهایی که ما می گوییم اجرا می شود. کد زیر نمونه ای از یک htc است :



<PUBLIC:COMPONENT>
<PUBLIC:ATTACHEVENT="onmouseover"ONEVENT="handleMouseOver()"/>
<PUBLIC:ATTACHEVENT="onmouseout"ONEVENT="handleMouseOut()"/>
<SCRIPTLANGUAGE="JScript">
var normalColor, normalSpacing;
function handleMouseOver()
{
this.style.border = "1px solid black";
}
function handleMouseOut()
{
this.style.border = "1px solid silver";
}
</SCRIPT>
</PUBLIC:COMPONENT>

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

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

دوستان اگر متوجه شدند لطفاً راهنمایی کنند که چطور می شه از خصوصیت behavior در css استفاده کرد؟
الان موقع کامپایل خطا می ده که خصوصیت behavior ناشناخته است و قابل استفاده نیست.

Alireza_Salehi
یک شنبه 19 اردیبهشت 1389, 18:55 عصر
این روش فقط با اینترنت اکسپلورر و اون هم فقط 5.5 به بعد کار میکنه. استفاده نکنید استاندارد نیست.

به نقل از وب سایت w3schools در قسمت XML Dont't:
Internet Explorer - Behaviors

What is it? Internet Explorer 5 introduced behaviors. Behaviors are a way to add behaviors to XML (or HTML) elements with the use of CSS styles.
Why avoid it? The behavior attribute is only supported by Internet Explorer.
What to use instead? Use JavaScript and XML DOM (or HTML DOM) instead.


http://msdn.microsoft.com/en-us/library/ms531078%28vs.85%29.aspx

http://www.w3schools.com/xml/xml_dont.asp

برای اطلاعات بیشتر این را جستجو کنید:
dhtml behavior

alireza_s_84
یک شنبه 19 اردیبهشت 1389, 19:19 عصر
سلام:معمولا از فایل های htc برای فعال کردن کلاسهای کاذب در اینترنت اکسپلورر 6 به پایین استفاده میشه.
کلاسهای کاذب کلاس هایی هستند که با : از کلاس جدا میشن مثل:
hover:
active:
این کلاسها در مرورگر IE6 و پایینتر تنها بر روی المنت a اعمال میشن و برای فعال شدن اونها روی المنت های دیگه از یک فایل htc استفاده میشه.
از اونجا که خصوصیت behavior یک خصوصیت استاندارد نیست باید با استفاده از شرط این خصوصیت رو به صفحه اضافه کنیم تا در اعتبارسنجی صفحه مشکلی پیش نیاد :
<!--[if lt IE 7]>
<style type="text/css">
body
{
behavior: url('Scripts/csshover.htc');
}
</style>
<![endif]-->
با دستور فوق تنها اگر مرورگر ما اینترنت اکسپلورر 6 و پایینتر باشد فایل htc در پردازش صفحه مورد استفاده قرار میگیره و در غیر اینصورت مثل یک کامنت پردازش میشه.
نکته نهایی اینکه فایلهای htc تنها در صورتی عمل میکنن که جاوا اسکریپت در سمت کلاینت فعال باشه.

این روش فقط با اینترنت اکسپلورر و اون هم فقط 5.5 به بعد کار میکنه. استفاده نکنید استاندارد نیست.
من میگم استفاده کنید چون برای داشتن یک صفحه cross-browser اجتناب ناپذیره و اگر نکاتی که گفتم رو رعایت کنید هیچ مشکلی از لحاظ استاندارد بودن صفحه نخواهید داشت و این خود یک فن در طراحی صفحات وب به شمار میره.
موفق باشید

alirezaed
جمعه 31 اردیبهشت 1389, 16:22 عصر
پس از بررسیهای زیاد به این نتایج رسیدم و حالا به مشکل دیگری برخوردم:

1- فایل css ما باید چیزی مثل کد زیر را داشته باشد:


.test
{
behavior:url(css\test.htc);
}

2- خود فایل htc باید چیزی مثل این باشد:


<public:component>
<public:attach event="onblur" onevent="handleBlur()" />

<script>
function handleBlur(){

var time = element.value;
var invalidTime = false;
var hour = "";
var mins = "";

if (time=="") {
element.style.border = "1px solid red";
returnfalse;
}
if (time.indexOf(":")==-1) {
if (time.length==3 || time.length>4)
invalidTime = true;
elseif (time.length<3)
hour = time;
else {
hour = time.substr(0, 2);
mins = time.substr(2, 2);
}
} else {
hour = time.substring(0, time.indexOf(":"));
mins = time.substring(time.indexOf(":")+1, time.length);
}

}

</script>
</public:component>

3- در قسمت head از صفحه ای که داریم توش کار می کنیم باید کد زیر رو داشته باشیم:


<linkhref="include/StyleSheet.css"rel="Stylesheet"type="text/css"/>

4- همچنین اونجایی که کامپوننت رو گذاشتم خاصیت کلاس رو به test نسبت دادم.


<inputclass="test"id="tic"runat="server"/>


تا اینجا همه چی درسته. چون من دارم از masterpage استفاده می کنم این کد قسمت 3 رو در masterpage قرار دادم.
الان در صفحه ای که دارم از اون فایل htc استفاده می کنم مشکلی نداره.
مشکل اینجاست که اگر بخوام در فایلهای دیگه که توی دایرکتوری های دیگر هستند، از این فایل استفاده کنم نمی شناسدش. یعنی آدرس فایل رو نمی تونه تشخصی بده. همه این زیریارم امتحان کردم ولی نشد.


url(css/test.htc)
url(./css/test.htc)
url(~/css/test.htc)
url(/css/test.htc)

کسی می تونه بگه چی باید بنویسم که به روت برنامه ام برم؟
نکته: توی textbox هایی که از این کلاس هستند، باید فرمت ساعت وارد بشه . کار این کد اینه که اگر فرمت اشتباه وارد شد، هشدار بده اگر درست بود با فرمت دلخواه من در textbox به نمایش در بیاد که موقع ذخیره کردن به مشکل نخورم.

alirezaed
جمعه 31 اردیبهشت 1389, 21:54 عصر
آخه چرا این visualStudio انقدر احمقه؟
الان اگر برم توی هر دایکتوری یه فولدر و فایل htc با همان اسامی درست کنم، فایل ها رو می بینه و درست عمل می کنه.
ولی الان که فایلهام یک جاست، فقط روی صفحاتی که روی روت برنامه هستند (سبزه) داره کار می کنه....

alirezaed
یک شنبه 02 خرداد 1389, 09:26 صبح
فهمدیم اشکال از کجاست. توی url باید آدرس کل فایل رو بزنیم مثل :


behavior:url(http://localhost:1058/website/include/TextBox.htc)


من یک متدی درست کردم که این آدرس رو تولید می‌کنه. فقط نتونستم از اون متد توی فایل css استفاده کنم. من اینکارو کردم جواب نداد. چکار کنم؟


behavior:url(<%=MapUrl("~/include/TexxBox.htc")%>)


متد MapUrl هم این ا ست:



public string MapUrl(string url)
{
string str = Request.Url();
return str.SubString(0,str.IndexOf("/",8)) + ResolveClientUrl(url)
}

این متد رو توی مستر پیجم گذاشتم ولی گویا از اونجا داره دیده نمی‌شه.

alirezaed
یک شنبه 02 خرداد 1389, 21:31 عصر
راهشو پیدا کردم.
اول فایل css رو بصورت aspx تعریف کردم. یعنی پسوندشو عوض کردم.
بعد بالای اون صفحش اینو نوشتم:


<%@ Page %>
<%@ import namespace="Ared.Common" %>


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

همینجا جا داره از تمام دوستانی که در این سایت کمک می کنن تا بچه ها مشکلاشونو حل کنن سپاسگذاری کنم.:اشتباه: