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

[dOCnOK]

السلام عليكم

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

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

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

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


مثال

كود الصفحة

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

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

<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]

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

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

<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]

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

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

<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]

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

<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> 

[ليث الشرس]

zizwar

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

[dOCnOK]

Zizwar الف الف شكرا

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