ورود

View Full Version : سوال: چيدن چند تصوير در كنار هم


pedram_ns
یک شنبه 14 شهریور 1389, 11:24 صبح
سلام

من يك مشكل كوچيك دارم.

براي ساخت يك نقشه مجبور شدم نقشه ام رو به چند قسمت تقسيم كنم و بعد در صفحه وبم اونها رو كنار هم بچينم بطور 3 در 3 .(با اين كار مي شه دكمه هايي براي حركت در نقشه گذاشت)

مشكلم اينه كه تصاوير دقيقا كنار هم نمي افته با استفاده از جدول در ie بينشون به طور افقي فاصله مي افته و با استفاده از div در تمامي مرورگرها بطور عمودي فاصله مي افته چطور همه رو دقيقا كنار هم بچينم؟
بايد اضافه كنم كه cellpadding و Cellspacing و Border برابر با صفر گذاشتم و اندازه كل جدول و اندازه هر سلول و هر عكس رو دقيق وارد كرد.
soroush_farda
یک شنبه 14 شهریور 1389, 11:29 صبح
سلام

منم میخوام همین کار شما رو انجام بدم ولی تا همین جا رو هم گیر کردم . میشه توضیح بدین برای حرکت این تصاویر با کلیک موس چکار کردین.
hamiii
یک شنبه 14 شهریور 1389, 12:31 عصر
با استفاده از div در تمامي مرورگرها بطور عمودي فاصله مي افته

شما باید margin رو برای div ها صفر کنی،چون بصورت پیش فرض در بعضی مرورگرها صفر نیست.
اگه با اینکار درست نشد کدشو بزار اینجا .
موفق باشی
pedram_ns
یک شنبه 14 شهریور 1389, 12:39 عصر
خوب من اول نقشه رو به قطعات كوچك 100 در 100 پيكسل تبديل كردم و هر كدوم رو بر اساس شماره رديف و ستون نام گذاري كردم مثلا 13-4 تصويريه كه در سطر 4 و ستون 13 نسبت به تصوير نقشه كامل قرار مي گيره.
بعد در ديتابيسم علاوه بر نام تصوير يك قسمت row و column گذاشتم و شماره سطر و ستون رو در اون گذاشتم يك فيلد هم به عنوان search كه كلمات كليدي هر عكس در اون هست مثلا نام خيابان انقلاب رو در اون نوشتم و اگه كاربر كلمه انقلاب رو سرچ كنه از اين فيلد تصوير مورد نظر و سطر و ستون اون رو پيدا مي كنم.
حالا در صفحه وبم يك جدول 3 در 3 دارم كه 9 تصوير رو در اون مي ذارم كه در كنار هم يك تصوير بزرگتر از نقشه رو مي ده.
اگه كاربر انقلاب رو سرچ كنه بر اساس جستجو سطر و ستون عكس رو مي گيرم با هم تركيب مي كنم تا نام تصويرم رو بگيرم. يعني سطر 4 و ستون 13 رو مي ده من بصورت 13-4.gif درش ميارم كه نام تصوير مورد نظر منه و اون رو در مركز جدولم مي ذارم. حالا بر اساس اون تصاوير دور برش رو پيدا مي كنم مثلا اگه از سطر يكي كم كن تصوير زيري يو مي ده هموينطور تا اخرين تصوير پيدا مي شه.
حالا واسه حركت يك دكمه مي ذاري مثلا حركت به راست در كد اين دكمه همون سطر و ستون رو ميگري(مي توني در صفحه دو تا hiddenfield بذاري و سطر و ستون رو در اون بنويسي و هر دفعه خواستي دوباره بخونيش فقط در اخر كدها بايد دوباره مقدار hiddenfield ها رو بروز كني)
حالا كافيه به ستون ها يكي اضافه كني و دوباره تصاوير رو نشون بدي اينجوري يك ستون به راست حركت مي كني براي جهت هاي ديگه هم همينطور.
فقط چند تا نكته مي مونه
اول اينكه همه اين سيستم رو در يك update panel بذار تا بدون رفرش صفحه تصاوير حركت كنه.
دوم حتما يك شرط بذار كه اگه اخرين تصوير به آخرين ستون رسيد دكمه ديگه كار نكنه يعني اگه نقشه ات روبه 30 ستون تبديل كردي براي حركت به راست تعريف كن اگه آخرين تصوير سمت راست ستونش برابر 30 هست ديگه دكمه كار نكنه چون به اخر نقشه رسيدي.

حالا مشكلم اينه كه در ie اين جدول در خطوط افقي بينشون فاصله مي افته ولي در مرورگر هاي ديگه درست كار مي كنه.
pedram_ns
یک شنبه 14 شهریور 1389, 12:55 عصر
شما باید margin رو برای div ها صفر کنی،چون بصورت پیش فرض در بعضی مرورگرها صفر نیست.
اگه با اینکار درست نشد کدشو بزار اینجا .
موفق باشی

من همه رو امتحان كردم با صفر كردن font-size مشكلم در firefox حل شد ولي هنوز در ie پا برجاست.
pedram_ns
یک شنبه 14 شهریور 1389, 13:04 عصر
اينم كد هام:

<body>
<form id="form1" runat="server">
<div style="border-width: 0px; border-style: none; text-align: center; font-size: 0px;">

<asp:Image ID="Image1" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
<asp:Image ID="Image2" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
<asp:Image ID="Image3" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />

</div>

<div style="border-width: 0px; border-style: none; text-align: center; font-size: 0px;">
<asp:Image ID="Image4" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
<asp:Image ID="Image5" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
<asp:Image ID="Image6" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
</div>
<div style="border-width: 0px; border-style: none; text-align: center; font-size: 0px;">
<asp:Image ID="Image7" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
<asp:Image ID="Image8" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
<asp:Image ID="Image9" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
</div>
</form>
</body>
ali_za
یک شنبه 14 شهریور 1389, 13:10 عصر
با سلام دوست عزيز من 2*2 درست كردم البته با جدول (عكس يانگوم) لطف كنيد بگيد منظورتون همين بود يا خير البته من هم در ie و هم فايرفاكس تست كردم ومشكلي نداشت فايل رو دانلود كنيد
با سپاس
pedram_ns
یک شنبه 14 شهریور 1389, 14:58 عصر
دوست گرامي شما از كنترل image در html استفاده كرديد در اين صورت مشكلي نداره

<img alt="" src="Images/web/bl.gif" />
ولي اگه به كد هام توجه كنيد من از كنترل ايميج asp استفاده كردم با اين كنترل اين مشكل رو ايجاد مي كنه

<asp:Image ID="Image7" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
hamiii
یک شنبه 14 شهریور 1389, 15:18 عصر
مشکل کد شما احتمالا به تگ های img ای باشه که asp تولید میکنه. وگرنه در حالت عادی هیچ مشکلی پیش نمیاد(example رو ببینید.)

یک راهی که تو این موارد کارایی داره اینه که source صفحه ای که تولید شده را ببینید.(right click > view source) از سورس میتونید بفهمید که چه تگ های htmlای بوجود اومدن و آیا استایلی گرفتن یا نه.که با توجه به کد شما مطمئنا فقط 9 عدد تگ img خواهیم داشت که سه به سه داخل یک div محصور شده اند.div که margin صفر دارند. فقط میمونه img ها. پس بهتره توی استایل ها به تگ img یک margin:0 بدهید.بصورت زیر:


img{margin:0px}
ali_za
یک شنبه 14 شهریور 1389, 15:28 عصر
دوست گرامي شما از كنترل image در html استفاده كرديد در اين صورت مشكلي نداره

<img alt="" src="Images/web/bl.gif" />
ولي اگه به كد هام توجه كنيد من از كنترل ايميج asp استفاده كردم با اين كنترل اين مشكل رو ايجاد مي كنه

<asp:Image ID="Image7" runat="server" BorderStyle="None" BorderWidth="0px"
ImageUrl="~/Images/web/bl.gif" />
با سلام دوست عزيز
من كد هاي شما رو نديده بودم(آخرين پست تون رو) شايد در حال نوشتن متن بودم
به هر حال كد شما رو با تگ asp تست كردم البته با عكسي كه خودم گذاشتم هيچ مشكلي پيش نيامد هم در ie و هم در fire fox
با سپاس
pedram_ns
یک شنبه 14 شهریور 1389, 16:08 عصر
با سلام دوست عزيز
من كد هاي شما رو نديده بودم(آخرين پست تون رو) شايد در حال نوشتن متن بودم
به هر حال كد شما رو با تگ asp تست كردم البته با عكسي كه خودم گذاشتم هيچ مشكلي پيش نيامد هم در ie و هم در fire fox
با سپاس
دوست عزيز مي شه يك لطفي كنيد و كد هاي asp رو برام بذاريد ممنون مي شم.
pedram_ns
یک شنبه 14 شهریور 1389, 16:28 عصر
دوستان از همگي كه لطف كرديد و راهنمايي كرديد سپاس گذارم مشكلم حل شد.
از جدول استفاده كردم و مقدار font-size رو صفر كردم مشكل ie حل شد.
خودم نفهميدم چه ربطي داشت؟؟؟؟؟؟؟؟