مطلوب جافا سكريبت لتصغير الصور الكبيره

dOCnOK · 10-03-2008, 08:19 PM

السلام عليكم

الإخوه الأعزاء أعضاء سوالف سوفت

انا بحاجة الى جافا سكريب لتصغير الصور داخل مكان معين بالصفحة (داخل خلية معينه او div)

بشرط ان تقوم بتصغير الصور التي يزيد عرضها عن 500px

وتقوم بالتعديل التالي على الصور المصغرة تضع لها رابط(<a>) يوجه الى رابط الصورة الأصل (الصورة الكبيرة)
وتضع في الـrel للصورة القيمة "lightbox"

مثال

كود الصفحة

كود HTML:

<div id="images"> <img src="no5ive.com/style/docnok/logo.gif" /> </div>

وتقوم السكريبت بتحويله الى

كود HTML:

<div id="images"> <a href="http://no5ive.com/style/docnok/logo.gif"> <img src="http://no5ive.com/style/docnok/logo.gif" width="200" rel="lightbox" /> </a> </div>

بإنتظار الأخ Zizwar وبقية الأخوة

Wcc · 11-03-2008, 03:06 PM

السلام عليكم ...

برمجنالك كود بسيط على قد الحال و المعرفة

كود PHP:

  <script type="text/javascript">
 
var wcc = document.getElementById('img');
var prop = wcc.height/wcc.width;
if (wcc.width > 500 ){ // إذا كان عرض الصورة أكبر من 500
wcc.width = 500;// إجعل العرض يساوي 500
wcc.height = 500*prop; // و أجعل الإرتفاع يساوي 500
}
 
</script>

فقط تذكر أن تعطي معرف للصورة "id ="img

بالتوفيـــــــــق

dOCnOK · 12-03-2008, 02:49 PM

إقتباس:

المشاركة الأصلية بواسطة Wcc

السلام عليكم ...

برمجنالك كود بسيط على قد الحال و المعرفة

كود PHP:

<script type="text/javascript"> var wcc = document.getElementById('img'); var prop = wcc.height/wcc.width; if (wcc.width > 500 ){ // إذا كان عرض الصورة أكبر من 500 wcc.width = 500;// إجعل العرض يساوي 500 wcc.height = 500*prop; // و أجعل الإرتفاع يساوي 500 } </script>

فقط تذكر أن تعطي معرف للصورة "id ="img

بالتوفيـــــــــق

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

اخي الكريم أشكرك على الكود ولكنه لا يفي بالمطلوب

Zizwar · 12-03-2008, 03:25 PM

جرب هذا التعديل الذي اجريته على ملف الأخ wcc

كود PHP:

  <script type="text/javascript">
<!--
$width = 500; // change it
window.onload = function(){
var wcc = document.getElementsByTagName('img');
    for(i=0; i<wcc.length; i++){
        var Img = new Image();
        Img.src = wcc[i].src;
         if(Img.width > $width ){
            wcc[i].width = "200" // change it
            //wcc[i].height = "200";
            wcc[i].rel = "lightbox";
            wcc[i].style.cursor = "pointer";
            wcc[i].onclick = function(){
                document.location = this.src;
            }
        }
    }
}
//-->
</script>

ليث الشرس · 14-03-2008, 09:49 PM

zizwar

مبدع كالعادة ..

dOCnOK · 17-03-2008, 04:38 PM

Zizwar الف الف شكرا

وجزاك الله كل خير

المواضيع المشابهه
الموضوع	كاتب الموضوع	القسم	الردود	آخر مشاركة
مطلوب*** سكربت تحميل الصور ومكتة الصور المجاني	المتميز	عروض البيع وطلبات الشراء في البرمجة والتصميم وبناء المحتوى وتبادل الاعلانات	0	28-04-2006 04:17 AM
سكريبت KTools الرائع لإستضافة الصور	Egyptian	الويب والويب 2.0 والـ Semantic Web	7	24-04-2006 02:29 AM
هل هذا السعر يناسب هذه الكاميره	gladiator	التصميم والرسومات والمونتاج	29	18-04-2006 09:45 PM
مطلوب سكريبت جافا ( عاجل )	alwahanet	الويب والويب 2.0 والـ Semantic Web	3	08-10-2002 02:49 PM
جالب الاخبار - نسخة جافا سكريبت - قص ولصق وتكون جاهزة	رائد	الويب والويب 2.0 والـ Semantic Web	2	21-09-2000 05:09 AM

أدوات الموضوع
مشاهدة نسخة مطبوعة إرسال هذه الصفحة