أريد أيقونة ترمز إلى صورة و ربطها مع صورة بالموقع

العبدلله كتب:

السلام عليكم ورحمة الله و بركاته

أريد أيقونة ترمز إلى وجود صورة لكي أضعها بصقحة موجودة على النت .

و كذلك طريقة ربطها مع الصورة المحملة بالموقع ، بحيث عندما يتم الضغط على الأيقونة تظهر الصورة .

علما بأنني أعمل على تحرير صقحة النت عن طريق برنامج فرونت بيج 2003

جزاكم الله خيراً

الأخ الكريم.

أنا لم أفهم سوالك 100%، لكن على حسب ما فهمت أنصحك بالغة الـ javascript، وأعتقد انك سوف تجد ضالتك هناك.

السلام عليكم

ليس لدي فكرة عن الجافا و لكنني لا أعتقد أنني بحاجتها .

و للتوضيح فإنه لدي موقع على النت (صفحة واحدة) و لدي صور قمت بتحميلها على السيرفر الخاص بالموقع ، و لكنني إلى الآن لم أربط هذه الصور

بالصفحة ، و ما أريده هو :

1- أيقونة شكلها يوحي بأنها رابط لصورة .

2- كيفية ربط الأيقونة بصورة من صور الموقع .

تحياتي .

أرجو ان توضح لي ما تقصد.. ما فهمته هو انك تريد عرض صور على موقعك علي شكل thumbnail، ومن ثَم الضغط عليها يرسلك الى الصورة الأصلية بحجمها الكامل.

اتجه الى الرابط الآتي

CSS-Only Lightbox

الأخ عبد الله.

هل رد عبد الرحمن هو طلبك؟. إذا لم يكن طلبك أخبرنا لمحاولت حل مشكلتك.

السلام عليكم ورحمة الله و بركاته

الأخوين mazenwrq' و عبد الرحمن جزاكما الله خيراً .

نعم ما أريده قريب إلى حد ما من الذي هو موجود بالرابط .

موقعي على النت صفحة بها جدول يتكون من عمودين و عدة صفوف كل صف يحتوي العمود الأول منه على إسم جهة و العمود الثاني أريد أن أضع به

أيقونة صغيرة تتناسب مع حجمها داخل الجدول ، بحيث عندما أضغط على الأيقونة تظهر الصورة و التي هي عبارة عن مطوية تعريفية للجهة ، بالنسبة للصور

فهي جاهزة في إنتظار الحصول على أيقونة.

أشكرك شكراً جزيلاً على المناظر الطبيعية الجميلة و التي كلما أراها يجول بخاطري شيء ألا وهو :

إذا كانت الدنيا بهذا الجمال و هذه الروعة فكيف يكون إذا شكل الجنة ...... يا سبحان الله ......... أدخلنا الله و إياكم و جميع المسلمين جنة الفردوس مع النبيين و الصديقين و الشهداء و الصالحين و حسن أولئك رفيقاً .

لازلت في الإنتظاار

حاول بهذا أخي الكريم:

<html>
<head>
<style type="text/css">
#myimg {
width: 128px;
height: 96px;
border: 3px solid #000;}
#myimg:hover {
width: 256px;
height: 192px;
border: 0px solid;}
</style>
</head>
<body>
<img src="yoururl.jpg" id="myimg">
</body>
</html>

هذا كود CSS و هو بسيط و مدمج مع HTML

رابط الصورة هو:

src="yoururl.jpg"

طبعا ضع صورة و يمكنك تغيير العرض و الطول قبل مرور الماوس:

#myimg {
width: 128px;
height: 96px;
border: 3px solid #000;}

و عند المرور:

#myimg:hover {
width: 256px;
height: 192px;
border: 0px solid;}

لمعاينة الكود ضعه في ملف نص عادي في المفكرة مثلا و احفظه بإمتداد html مثلا: effect.html

و افتحه بطريقة عادية

شكرا