জাভাস্ক্রিপ্টে ডাইনামিক প্রস্থের সমান উচ্চতা সেট করতে নিচের কোডটি চালান:
উদাহরণ
<!DOCTYPE html> <html> <head> <style> .wrap { width:400px; height:300px; border:2px solid yellow; } .myChild{ width: 80%; border:1px solid red; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script> <script> var res = $('.myChild').width(); $('.myChild').css({ 'height': res + 'px' }); </script> </head> <body> <div class = "wrap"> <div class = "myChild"></div> </div> </body> </html>
ব্যাখ্যা: এই উদাহরণে jQuery ব্যবহার করা হয়েছে। $('.myChild').width() দিয়ে বর্তমান প্রস্থ পাওয়া গেছে, তারপর .css('height', ...) দিয়ে উচ্চতা সেট করা হয়েছে। আধুনিক পদ্ধতিতে CSS-এ aspect-ratio: 1/1 বা padding-top: 100% (প্যারেন্টের প্রস্থের সমান) ব্যবহার করা ভালো, JS ছাড়াই।