قرار دادن لينك بر روي كنترل Image

[SAMARE]

سلام دوستان من در صفحه ام يه كنترل Image‌ دارم كه ميخوام با كليك ماوس بر روي آن به صفحه اي بره كه عكس رو در ابعاد واقعي نشون ميده ، ولي نميدونم بايد چطور اينكار رو انجام بدم!!!

[mahsa.n]

فكر كنم اين كمكت كنه
http://www.w3schools.com/css/tryit.asp?filename=trycss_image_gallery

[eyes_shut_number1]

این کاری که میخوای بکنی + افکت جالب
http://www.huddletogether.com/projects/lightbox2/

[man of rebellious being]

با سلام


پیشنهاد می کنم منطق کارتون رو در یک data list تعریف کنید و دز edit template ان hyperlink بگذارید بصورت زیر(البته من کد کا ملتر در حالت اتصال با database رو گذاشتم)

<ItemTemplate>
<div style=" height:183px; width:155px; margin-left:13px;" class="DatalistLeftPic" >

<asp:HyperLink ID="HyperLink15" runat="server" Height="218px" Width="155px" ImageUrl='<%# Eval("ImageUrl") %>' NavigateUrl='<%# Eval("Id", <"LargeSizePicLeft.aspx?Id={0}") %>' Target="_blank" ></asp:HyperLink
</div>

</ItemTemplate>

[SAMARE]

با سلام


پیشنهاد می کنم منطق کارتون رو در یک data list تعریف کنید و دز edit template ان hyperlink بگذارید بصورت زیر(البته من کد کا ملتر در حالت اتصال با database رو گذاشتم)

<ItemTemplate>
<divstyle=&quot;height:183px; width:155px; margin-left:13px;&quot;class=&quot;DatalistLeftPic&quot;>

<asp:HyperLinkID=&quot;HyperLink15&quot;runat=&quot;server&quot;Height= &quot;218px&quot;Width=&quot;155px&quot;ImageUrl='<%# Eval(&quot;ImageUrl&quot;) %>'NavigateUrl='<%# Eval(&quot;Id&quot;, <&quot;LargeSizePicLeft.aspx?Id={0}&quot;) %>'Target=&quot;_blank&quot;></asp:HyperLink
</div>

</ItemTemplate>


نميدونم چرا Width و height كنترل hyperlink‌ رو هر چي تغيير ميدم تغييرات اعمال نميشه و عكس رو با سايز واقعي اش درون كنترل قرار ميده!!!‌

[A.S.Roma]

نميدونم چرا Width و height كنترل hyperlink‌ رو هر چي تغيير ميدم تغييرات اعمال نميشه و عكس رو با سايز واقعي اش درون كنترل قرار ميده!!!‌
باید با جاواسکریپت سایزشون رو تغییر بدید.

[SAMARE]

باید با جاواسکریپت سایزشون رو تغییر بدید.

ميشه راهنمايي كنيد !!!

[A.S.Roma]

مثلا" با Jquery که ساده تره :
<script type="text/javascript">
$(document).ready(function(){
$("img").css("height" , 100);
$("img").css("width" , 100);
});
</script>

کد بالا همه ی تگ های img صفحه را resize می کند. می تونید شرایط رو محدود کنید. مثلا" همه عکس های داخل تگ div با ایدی container:

http://tehranpic.net/images/0klzbnth9vcmi27bwkpe.jpg

[SAMARE]

دوست عزيز من كد شما رو درون head قرار دادم ولي نميدونم چرا كار نميكنه؟؟؟ اسم كنترل hyperlink رو هم به img تغيير دادم!!!

[A.S.Roma]

ابتدا فایل Jquery رو از سایت Jquery دانلود کنید (http://code.jquery.com/jquery-1.4.2.min.js) و به پروژتون اضافه کنید . (
این خط را در قسمت Head اضافه کنید :



<script src="jquery-1.4.2.min.js" type="text/javascript"></script>


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

[SAMARE]

جواب نميده !!!

[man of rebellious being]

سلام

به div خود hyperlink هم باید اندازه بدید ضمنا max height و min width و... را برای data list ست کنید

[Vahid_moghaddam]

استفاده از jquery یا جاوا اسکریپت برای این مساله؟

شما می تونید یک عکس رو به صورت زیر تبدیل به لینک کنید:

<a href='page.aspx' ><img srec='image.png' style='width:100px; height:100px' /></a>

[Vahid_moghaddam]

اگه حتما لازمه که از کنترل های سرور استفاده کنید، به این شکل می شه:
1. خاصیت CssClass در Hyperlink رو مثلا برابر link قرار بدید.
2. از css زیر استفاده کنید:



<style>
.link img {width:30px; height:30px;}
</style>
و لینک:

<asp:HyperLink ID="HyperLink1" runat="server" CssClass="link" ImageUrl="~/dolphin.png" NavigateUrl="google.com">HyperLink</asp:HyperLink>

نکته: برای نمایش عکس به شکلی که می خواید، باید برای هر عکس یه thumbnail یا عکس کوچک درست کنید و در لینک thumnail رو نمایش بدید. به این دلیل که هیچ دلیلی نداره تمام عکس ها رو با سایز اصلی و حجم اصلی به مرورگر کاربر بفرستید.