منتدى الدعم العربي لمنتديات أحلى منتدى
مرحبا بك في منتدى دعم منتديات AhlaMontada

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

انشاء منتدى مجاني شبيه بهذا المنتدى
أحلى الشبكات الإجتماعية

انشاء منتدى مجاني



 انشاء منتدى مجاني

أقسام الدعم

دعم الخدمات العامة:
مشاكل كلمة السر
مشاكل فتح المنتدى
مشاكل لوحة الإدارة
مشاكل تنسيق المظهر
المشاكل الأخرى

----------------------

دعم الخدمات التكميلية :
مشاكل النطاقات
مشاكل التومبلايت

----------------------

مراسلة الإدارة :

طلب كلمة السر
إرسال أكواد أو شروحات
أتصل بنا
كيفية طلب كلمة سر جديدة
> طريقة طلب كلمة سر

تنبيه: لا تضع أبداً ايميل الإنشاء في مساهماتك و لا تعطيه لأحد!
أفضل الأعضاء الموسومين
@الزعيم
 
@@
 
@stones
 
@Mohamed Nsr2
 
@JAR7
 

عمل منتدى

تعديل صغير جدا ع كود

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

تعديل صغير جدا ع كود

مُساهمة من طرف سيد الكينج في الأربعاء 8 يوليو 2015 - 2:34

اريد تعديل هذا الكود باذن يتم تقليل مسافة كل صورة والثانية

الكود

الرمز:
<div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
</div>
 <style type="text/css">

/*Credits: Dynamic Drive CSS Library */

.hovergallery img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.hovergallery img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
-moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
opacity: 1;
}
</style>

سيد الكينج
 
 

ذكر
عدد المساهمات : 2881
معدل النشاط : 7327

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف البرق200 في الأربعاء 8 يوليو 2015 - 2:54

@سيد الكينج كتب:اريد تعديل هذا الكود باذن يتم تقليل مسافة كل صورة والثانية

الكود

الرمز:
<div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
</div>
 <style type="text/css">

/*Credits: Dynamic Drive CSS Library */

.hovergallery img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
opacity: 0.7; /*initial opacity of images*/
margin: 0 10px 5px 0; /*margin between images*/
}

.hovergallery img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
-webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
-moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
opacity: 1;
}
</style>
اهلا عزيزى  Cool
يوجد مشكلة فى اخر 4 صور على يسار تاكد من الكود !

البرق200
 
 

ذكر
عدد المساهمات : 1774
معدل النشاط : 6429

http://sea-alarab.com/montada-f19/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف البرق200 في الأربعاء 8 يوليو 2015 - 2:58

جرب الان
وتذكر تم تقريب من 8 الى 10
+
اخر 4 صور على يسار غير موجوده
الرمز:
        <div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
        </div>
        <style type="text/css">
       
        /*Credits: Dynamic Drive CSS Library */
       
        .hovergallery img{
        -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
        -moz-transform:scale(0.9); /*Mozilla scale version*/
        -o-transform:scale(0.9); /*Opera scale version*/
        -webkit-transition-duration: 0.11s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.11s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/
        }
       
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.1); /*Mozilla scale version*/
        -o-transform:scale(1.1); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>

البرق200
 
 

ذكر
عدد المساهمات : 1774
معدل النشاط : 6429

http://sea-alarab.com/montada-f19/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف سيد الكينج في الأربعاء 8 يوليو 2015 - 3:07

@البرق200 كتب:جرب الان
وتذكر تم تقريب من 8 الى 10
+
اخر 4 صور على يسار غير موجوده
الرمز:
        <div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
        </div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
        -moz-transform:scale(0.9); /*Mozilla scale version*/
        -o-transform:scale(0.9); /*Opera scale version*/
        -webkit-transition-duration: 0.11s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.11s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/
        }
        
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.1); /*Mozilla scale version*/
        -o-transform:scale(1.1); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>
انا وضعت صورتين فقط للتجربه .. انا لم الاحظ تقريب طيب ممكن تقرب اكثر بحيث الاحظ التقريب ؟ لان المسافه بعيدة لسه

سيد الكينج
 
 

ذكر
عدد المساهمات : 2881
معدل النشاط : 7327

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف البرق200 في الأربعاء 8 يوليو 2015 - 3:25

@سيد الكينج كتب:
@البرق200 كتب:جرب الان
وتذكر تم تقريب من 8 الى 10
+
اخر 4 صور على يسار غير موجوده
الرمز:
        <div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
        </div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
        -moz-transform:scale(0.9); /*Mozilla scale version*/
        -o-transform:scale(0.9); /*Opera scale version*/
        -webkit-transition-duration: 0.11s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.11s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/
        }
        
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.1); /*Mozilla scale version*/
        -o-transform:scale(1.1); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>
انا وضعت صورتين فقط للتجربه .. انا لم الاحظ تقريب طيب ممكن تقرب اكثر بحيث الاحظ التقريب ؟ لان المسافه بعيدة لسه


لآ فى فرق بعد التعديب وقبل التعديل
ونسبة كم اسلافت تقارب 8 من 10
https://i18.servimg.com/u/f18/13/64/63/40/uo_ouo41.png


Cool

البرق200
 
 

ذكر
عدد المساهمات : 1774
معدل النشاط : 6429

http://sea-alarab.com/montada-f19/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف البرق200 في الأربعاء 8 يوليو 2015 - 3:27

تفضل تقارب بنسبة 10 من 10
بعد التعديل
الرمز:
                <div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
                </div>
                <style type="text/css">
               
                /*Credits: Dynamic Drive CSS Library */
               
                .hovergallery img{
                -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
                -moz-transform:scale(1.0); /*Mozilla scale version*/
                -o-transform:scale(1.0); /*Opera scale version*/
                -webkit-transition-duration: 0.11s; /*Webkit: Animation duration*/
                -moz-transition-duration: 0.11s; /*Mozilla duration version*/
                -o-transition-duration: 0.5s; /*Opera duration version*/
                opacity: 0.7; /*initial opacity of images*/
                margin: 0 10px 5px 0; /*margin between images*/
                }
               
                .hovergallery img:hover{
                -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
                -moz-transform:scale(1.1); /*Mozilla scale version*/
                -o-transform:scale(1.1); /*Opera scale version*/
                box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
                -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
                -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
                opacity: 1;
                }
                </style>



وتذكر عزيزى

@الزعيم كتب:إذا حصلت على الجواب المقنع لسؤالك, لا تنس بتعديل موضوعك و وضع ايقونة تم الحل لتسهل عمل فريق المساعدة و تحافظ على النظام في منتدى الدعم.

وفقك الله
............ Cool

البرق200
 
 

ذكر
عدد المساهمات : 1774
معدل النشاط : 6429

http://sea-alarab.com/montada-f19/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف سيد الكينج في الأربعاء 8 يوليو 2015 - 23:50

@البرق200 كتب:تفضل تقارب بنسبة 10 من 10
بعد التعديل
الرمز:
                <div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
                </div>
                 <style type="text/css">
                
                /*Credits: Dynamic Drive CSS Library */
                
                .hovergallery img{
                -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
                -moz-transform:scale(1.0); /*Mozilla scale version*/
                -o-transform:scale(1.0); /*Opera scale version*/
                -webkit-transition-duration: 0.11s; /*Webkit: Animation duration*/
                -moz-transition-duration: 0.11s; /*Mozilla duration version*/
                -o-transition-duration: 0.5s; /*Opera duration version*/
                opacity: 0.7; /*initial opacity of images*/
                margin: 0 10px 5px 0; /*margin between images*/
                }
                
                .hovergallery img:hover{
                -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
                -moz-transform:scale(1.1); /*Mozilla scale version*/
                -o-transform:scale(1.1); /*Opera scale version*/
                box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
                -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
                -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
                opacity: 1;
                }
                </style>



وتذكر عزيزى

@الزعيم كتب:إذا حصلت على الجواب المقنع لسؤالك, لا تنس بتعديل موضوعك و وضع ايقونة تم الحل لتسهل عمل فريق المساعدة و تحافظ على النظام في منتدى الدعم.

وفقك الله
............ Cool
اخي الحبيب . معلش تعبتك معي .. لكن احتاج الي معرفة شئ هل من الممكن اضافة صورة فرعيه بجانب صور الكود ؟ يعني تكون بجانبهم بالصفحه لكن لن تتبع الكود لان كل لما بحاول اعمل كدا تكون الصورة الفرعيه فوق والكود تحت او العكس لكن لا يقفون بجانب بعضهم البعض

سيد الكينج
 
 

ذكر
عدد المساهمات : 2881
معدل النشاط : 7327

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف البرق200 في الخميس 9 يوليو 2015 - 3:55

@سيد الكينج كتب:
@البرق200 كتب:تفضل تقارب بنسبة 10 من 10
بعد التعديل
الرمز:
                <div class="hovergallery"><img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="رابط الصورة 3" /><img src="رابط الصورة 4" /><img src="رابط الصورة 5" /><img src="رابط الصورة 6" />
                </div>
                 <style type="text/css">
                
                /*Credits: Dynamic Drive CSS Library */
                
                .hovergallery img{
                -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
                -moz-transform:scale(1.0); /*Mozilla scale version*/
                -o-transform:scale(1.0); /*Opera scale version*/
                -webkit-transition-duration: 0.11s; /*Webkit: Animation duration*/
                -moz-transition-duration: 0.11s; /*Mozilla duration version*/
                -o-transition-duration: 0.5s; /*Opera duration version*/
                opacity: 0.7; /*initial opacity of images*/
                margin: 0 10px 5px 0; /*margin between images*/
                }
                
                .hovergallery img:hover{
                -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
                -moz-transform:scale(1.1); /*Mozilla scale version*/
                -o-transform:scale(1.1); /*Opera scale version*/
                box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
                -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
                -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
                opacity: 1;
                }
                </style>



وتذكر عزيزى

@الزعيم كتب:إذا حصلت على الجواب المقنع لسؤالك, لا تنس بتعديل موضوعك و وضع ايقونة تم الحل لتسهل عمل فريق المساعدة و تحافظ على النظام في منتدى الدعم.

وفقك الله
............ Cool
اخي الحبيب . معلش تعبتك معي .. لكن احتاج الي معرفة شئ هل من الممكن اضافة صورة فرعيه بجانب صور الكود ؟ يعني تكون بجانبهم بالصفحه لكن لن تتبع الكود لان كل لما بحاول اعمل كدا تكون الصورة الفرعيه فوق والكود تحت او العكس لكن لا يقفون بجانب بعضهم البعض

وضح طلبك اكثر اخى العزيز

البرق200
 
 

ذكر
عدد المساهمات : 1774
معدل النشاط : 6429

http://sea-alarab.com/montada-f19/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف سيد الكينج في الخميس 9 يوليو 2015 - 4:55

اخواني انا كل ما اجي احط لينك للصورة تنشال الصورة كيف اضع رابط للصورة اول ما يدوس عليها العضو يدخل عليها ؟

سيد الكينج
 
 

ذكر
عدد المساهمات : 2881
معدل النشاط : 7327

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف سيد الكينج في الأحد 12 يوليو 2015 - 7:22

up

سيد الكينج
 
 

ذكر
عدد المساهمات : 2881
معدل النشاط : 7327

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف stones في الأحد 12 يوليو 2015 - 11:02

بعد اذن الاخوه اعلاه
----------------
تفضل الكود
الرمز:
       
<div class="hovergallery">
                   <img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="  http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" />        
</div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
        -moz-transform:scale(0.8); /*Mozilla scale version*/
        -o-transform:scale(0.8); /*Opera scale version*/
        -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.5s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/


        }



        .hovergallery img {
margin: -20px ;
         }
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.1); /*Mozilla scale version*/
        -o-transform:scale(1.1); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;

        }
        </style>

لاكن تظهر بمظهر غير مناسب يجب تقليل الصور


وهذا كود اخر لاكن تصغر الصور

الرمز:
       
<div class="hovergallery">
                                                 <img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="  http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" />        
</div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.5); /*Webkit: Scale down image to 0.5x original size*/
        -moz-transform:scale(0.8); /*Mozilla scale version*/
        -o-transform:scale(0.8); /*Opera scale version*/
        -webkit-transition-duration: 0.3s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.3s; /*Mozilla duration version*/
        -o-transition-duration: 0.3s; /*Opera duration version*/
        opacity: 0.3; /*initial opacity of images*/
        margin: 5 5px 5px 5; /*margin between images*/


        }



        .hovergallery img {
margin: -30px ;





         }
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(0.5); /*Mozilla scale version*/
        -o-transform:scale(0.5); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 10px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 10px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 10px gray; /*Mozilla shadow version*/
        opacity: 1;

        }
        </style>

وهذا اخر صور على بعض
الرمز:
       
<div class="hovergallery">
               <img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src=" http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" />       
</div>
        <style type="text/css">
       
        /*Credits: Dynamic Drive CSS Library */
       
        .hovergallery img{
        -webkit-transform:scale(0.2); /*Webkit: Scale down image to 0.2x original size*/
        -moz-transform:scale(0.-4); /*Mozilla scale version*/
        -o-transform:scale(0.-4); /*Opera scale version*/
        -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.5s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/




        }
       
        .hovergallery img:hover{
        -webkit-transform:scale(1.2); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.2); /*Mozilla scale version*/
        -o-transform:scale(1.2); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>

stones
 
 

ذكر
عدد المساهمات : 11045
معدل النشاط : 13485

http://stones.arab.st/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف سيد الكينج في الأحد 12 يوليو 2015 - 20:55

@stones كتب:بعد اذن الاخوه اعلاه
----------------
تفضل الكود
الرمز:
       
<div class="hovergallery">
                   <img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="  http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" />        
</div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
        -moz-transform:scale(0.8); /*Mozilla scale version*/
        -o-transform:scale(0.8); /*Opera scale version*/
        -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.5s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/


        }



        .hovergallery img {
margin: -20px ;
         }
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.1); /*Mozilla scale version*/
        -o-transform:scale(1.1); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;

        }
        </style>

لاكن تظهر بمظهر غير مناسب يجب تقليل الصور


وهذا كود اخر لاكن تصغر الصور

الرمز:
       
<div class="hovergallery">
                                                 <img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="  http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" />        
</div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.5); /*Webkit: Scale down image to 0.5x original size*/
        -moz-transform:scale(0.8); /*Mozilla scale version*/
        -o-transform:scale(0.8); /*Opera scale version*/
        -webkit-transition-duration: 0.3s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.3s; /*Mozilla duration version*/
        -o-transition-duration: 0.3s; /*Opera duration version*/
        opacity: 0.3; /*initial opacity of images*/
        margin: 5 5px 5px 5; /*margin between images*/


        }



        .hovergallery img {
margin: -30px ;





         }
        .hovergallery img:hover{
        -webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(0.5); /*Mozilla scale version*/
        -o-transform:scale(0.5); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 10px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 10px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 10px gray; /*Mozilla shadow version*/
        opacity: 1;

        }
        </style>

وهذا اخر صور على بعض
الرمز:
        
<div class="hovergallery">
            <img _moz_resizing="true" src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" /><img src=" http://im69.gulfup.com/fQsb3a.jpg" /><img src="http://im69.gulfup.com/fQsb3a.jpg" />        
</div>
         <style type="text/css">
        
        /*Credits: Dynamic Drive CSS Library */
        
        .hovergallery img{
        -webkit-transform:scale(0.2); /*Webkit: Scale down image to 0.2x original size*/
        -moz-transform:scale(0.-4); /*Mozilla scale version*/
        -o-transform:scale(0.-4); /*Opera scale version*/
        -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.5s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/




        }
        
        .hovergallery img:hover{
        -webkit-transform:scale(1.2); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.2); /*Mozilla scale version*/
        -o-transform:scale(1.2); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>
اخي الان
 انا كل ما اجي احط لينك للصورة تنشال الصورة كيف اضع رابط للصورة اول ما يدوس عليها العضو يدخل عليها ؟

سيد الكينج
 
 

ذكر
عدد المساهمات : 2881
معدل النشاط : 7327

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: تعديل صغير جدا ع كود

مُساهمة من طرف stones في الإثنين 13 يوليو 2015 - 8:10

تفضل الكود مع الروابط
الرمز:
<div class="hovergallery">
 <a href="رابط الموضوع" target="_blank"><img src="http://im69.gulfup.com/fQsb3a.jpg" />
</a> <a href="رابط الموضوع" target="_blank"><img src="http://im69.gulfup.com/fQsb3a.jpg" />
</a> <a href="رابط الموضوع" target="_blank"><img src="http://im69.gulfup.com/fQsb3a.jpg" />
</a> <a href="رابط الموضوع" target="_blank"><img src="http://im69.gulfup.com/fQsb3a.jpg" />
</a> <a href="رابط الموضوع" target="_blank"><img src=" http://im69.gulfup.com/fQsb3a.jpg" />
</a> <a href="رابط الموضوع" target="_blank"><img src="http://im69.gulfup.com/fQsb3a.jpg" /></a>
</div>
        <style type="text/css">
      
        /*Credits: Dynamic Drive CSS Library */
      
        .hovergallery img{
        -webkit-transform:scale(0.2); /*Webkit: Scale down image to 0.2x original size*/
        -moz-transform:scale(0.-4); /*Mozilla scale version*/
        -o-transform:scale(0.-4); /*Opera scale version*/
        -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.5s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/
 
 
 
 
        }
      
        .hovergallery img:hover{
        -webkit-transform:scale(1.2); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.2); /*Mozilla scale version*/
        -o-transform:scale(1.2); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>


وهذا كود اخر مع حجم الصور من الارقام جنب الصور

الرمز:
<div class="hovergallery">
    <a href="رابط موضوع" target="_blank">
<img style="width: 150px; height: 150px;" src="رابط صورة" />
</a> <a href="رابط موضوع" target="_blank">
<img style="width: 150px; height: 150px;" src="رابط صورة" />
</a> <a href="رابط موضوع" target="_blank">
<img style="width: 150px; height: 150px;" src="رابط صورة" />
</a> <a href="رابط موضوع" target="_blank">
<img style="width: 150px; height: 150px;" src="رابط صورة" />
</a> <a href="رابط موضوع" target="_blank">
<img style="width: 150px; height: 150px;" src=" رابط صورة" />
</a> <a href="رابط موضوع" target="_blank">
 <img style="width: 150px; height: 150px;" src="رابط صورة" /></a>
</div>
        <style type="text/css">
     
        /*Credits: Dynamic Drive CSS Library */
     
        .hovergallery img{
        -webkit-transform:scale(0.2); /*Webkit: Scale down image to 0.2x original size*/
        -moz-transform:scale(0.-4); /*Mozilla scale version*/
        -o-transform:scale(0.-4); /*Opera scale version*/
        -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
        -moz-transition-duration: 0.5s; /*Mozilla duration version*/
        -o-transition-duration: 0.5s; /*Opera duration version*/
        opacity: 0.7; /*initial opacity of images*/
        margin: 0 10px 5px 0; /*margin between images*/
 
 
 
 
        }
     
        .hovergallery img:hover{
        -webkit-transform:scale(1.2); /*Webkit: Scale up image to 1.2x original size*/
        -moz-transform:scale(1.2); /*Mozilla scale version*/
        -o-transform:scale(1.2); /*Opera scale version*/
        box-shadow:0px 0px 30px gray; /*CSS3 shadow: 30px blurred shadow all around image*/
        -webkit-box-shadow:0px 0px 30px gray; /*Safari shadow version*/
        -moz-box-shadow:0px 0px 30px gray; /*Mozilla shadow version*/
        opacity: 1;
        }
        </style>

stones
 
 

ذكر
عدد المساهمات : 11045
معدل النشاط : 13485

http://stones.arab.st/

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة


 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى