PDA

View Full Version : نحوه کار با li و a و ایجاد تصاویر لینک دار



mr.amani
یک شنبه 08 دی 1392, 13:29 عصر
سلام
من اسلایدی ساختم بوسیله li هایی که در اونها از تصاویر استفاده شده.
حالا هر کاری میکنم به این تصاویر لینک اضافه کنم نمیشه!
هر طور گید امتحان کردم ولی نشد و بیشتر سردرگم شدم!
لطفا اگر میتونید کمکم کنی.
نمونه رو هم اینجا قرار میدم :


<div id="slideshow1">
<a href="#left" class="left" style="display: block; opacity: 1;"></a>
<a href="#right" class="right" style="display: block; opacity: 1;"></a>
<div id="images1" style="overflow-x: hidden;">


<!--<ul>
<!--<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg0.jpg" /></li></a1>
<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg1.jpg" /></li></a1>
<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg2.jpg" /></li></a1>
<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg3.jpg" /></li></a1>
<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg4.jpg" /></li></a1>
<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg5.jpg" /></li></a1>
<a1 class="k" target="_blank" href="#"><li><img class="k1" src="images/iimg6.jpg" /></li></a1>-->

<!--<li><a1 href="#"><img class="k1" src="images/iimg0.jpg" /></a1></li>
<li><a1 href="#"><img class="k1" src="images/iimg1.jpg" /></a1></li>
<li><a1 href="#"><img class="k1" src="images/iimg2.jpg" /></a1></li>
<li><a1 href="#"><img class="k1" src="images/iimg3.jpg" /></a1></li>
<li><a1 href="#"><img class="k1" src="images/iimg4.jpg" /></a1></li>
<li><a1 href="#"><img class="k1" src="images/iimg5.jpg" /></a1></li>
<li><a1 href="#"><img class="k1" src="images/iimg6.jpg" /></a1></li>-->
<!--</ul>-->


<ul>
<li><img src="images/iimg00.jpg" alt="">
<div class="bp"><a class="lia" href="#" style="display: block; opacity: 1;"><h3>EAP600</h3></a>
<span class="mp"> ipsum dolor sit amet...</span></div></li>

<li><img src="images/iimg00.jpg" alt="">
<div class="bp"><a class="lia" href="#" style="display: block; opacity: 1;"><h3>EAP600</h3></a>
<span class="mp"> ipsum dolor sit amet...</span></div></li>

<li><img src="images/iimg00.jpg" alt="">
<div class="bp"><a class="lia" href="#" style="display: block; opacity: 1;"><h3>EAP600</h3></a>
<span class="mp"> ipsum dolor sit amet...</span></div></li>

<li><img src="images/iimg00.jpg" alt="">
<div class="bp"><a class="lia" href="#" style="display: block; opacity: 1;"><h3>EAP600</h3></a>
<span class="mp"> ipsum dolor sit amet...</span></div></li>

<li><img src="images/iimg00.jpg" alt="">
<div class="bp"><a class="lia" href="#" style="display: block; opacity: 1;"><h3>EAP600</h3></a>
<span class="mp"> ipsum dolor sit amet...</span></div></li>
</ul>

</div>
</div>

تو نمونه آخری که یه دیو حاوی متن هم رو عکس آوردم که در واقع همینطوری میخوام اسلاید بزنم؛ وقتی css تعریف میشه براشون تو اسلاید اول متن ها تغریبا همون جایی که میخوام قرار می گیرن ولی تو اسلاید بعدی که میره جا به جا میشن!
نمیدونم خلاصه حسابی گیج شدم تو این مدل اسلاید.
مشکل اصلی هم اینه که تو اسلاید تگ a رو موندم باهاش چیکار کنم که دکمه هایی که برای انتقال اسلاید ها به راست و چپ اتو هاید هستن و نمیدونم طور شد یه سری که روش کار می کردم متن های h3 که عنوان اسلاید ها هم هست میرفتن دقیقا زیر محل دکمه اسلایدر قرار میگرفتن و مثل اونا مخفی بودن و وقتی موس میرفت روشون نشوم داده میشدن!

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

ateryad
یک شنبه 08 دی 1392, 13:52 عصر
سلام دوست عزیز
چرا کنار تگ a یک عدد 1 گذاشتید...؟!؟!؟!

این طوری انجام بدهید:


<ul>
<li><a href="address"><img> </a> </li>
</ul>

mr.amani
یک شنبه 08 دی 1392, 14:14 عصر
آخه اونطوری هم زدم ولی نمیدونم چرا به مشکل میخوردم
شما لیستای بالا رو ببین
اونجا نمونه های دیگه ای هم داشتم.
اگر میتونی همین رو درست کن و فایل اصلاحیت رو برام بذار لطفا

ateryad
یک شنبه 08 دی 1392, 14:25 عصر
دوست عزیز بنده گفتم که چرا 1 رو کنار تگ لینک گذاشتید، اگر 1 رو بردارید و اونطور که گفتم انجام بدید درست میشه.
اون 1 اضافه هست.

mr.amani
یک شنبه 08 دی 1392, 22:32 عصر
آخه اگر فایل همرا رو دانلود میکردی و بررسی می کردی متوجه می شدی چرا!
ببین تو فایلی که گذاشتم یه فایل jquery هم هست که ازش واسه اسلایدر کمک گرفته شده
اونجا برای مخفی کردن کنترلرهای چپ و راست اسلایدر تگ a رو اتوهاید کرده تا مخفی باشن و وقتی موس بره رو اسلاید نشون داده بشن.
حالا همین باعث تداخل تو کار تگهای a تو قسمتهای مختلف من شده و همه از اون پیروی میکنن.
برای همین من a1 دادم.
مگه اشکالی تو کار ایجاد میکنه؟
لطفا اگه میتونی فایلهارو بررسی کن و درستش کن.
فقط از فایل jquery یادت نره که برای اسلاید لازمه.

meysam1366
یک شنبه 08 دی 1392, 23:18 عصر
آخه اگر فایل همرا رو دانلود میکردی و بررسی می کردی متوجه می شدی چرا!
ببین تو فایلی که گذاشتم یه فایل jquery هم هست که ازش واسه اسلایدر کمک گرفته شده
اونجا برای مخفی کردن کنترلرهای چپ و راست اسلایدر تگ a رو اتوهاید کرده تا مخفی باشن و وقتی موس بره رو اسلاید نشون داده بشن.
حالا همین باعث تداخل تو کار تگهای a تو قسمتهای مختلف من شده و همه از اون پیروی میکنن.
برای همین من a1 دادم.
مگه اشکالی تو کار ایجاد میکنه؟
لطفا اگه میتونی فایلهارو بررسی کن و درستش کن.
فقط از فایل jquery یادت نره که برای اسلاید لازمه.

سلام دوست عزیز

ببینید دوست عزیز ما اصلا تگی به نام <a1> نداریم خوب معلوم اشتباهه بعدشم شما برای اینکه بخواید که وقتی موس روی تصاویر رفت آیکونها ظاهر بشن شما باید از تگهای دیگه ای مثل <span> استفاده کنید بعد بهش

آی دی بدید بعد توسط این آی دی بهش توی جی کوئری دستور لازم رو تحمیل کنید

امیدوارم متوجه عرائض بنده شده باشید

موفق باشید