basti1012.bplaced.net

Hallo liebe Freunde, ich hänge an einer Kleinigkeit und kann diese leider nicht lösen, vielleicht könnt ihr mir helfen. Ist es möglich in Javascript das überliegende DIV auszulesen? Ich möchte nämlich Bilder anpassen nach ungefährer folgender Formel: width=100% if (picture.height < darüberliegendes_div.height) { picture.height = 100%; picture.width = auto; } Kann meine Lösung so funktionieren oder ist das gar nicht möglich in Javascript?

Code

                                    
                                <script src="/js_webseite/jquery.js"></script>
<style>
  div{
  height:200px;
  width:150px;
  overflow:hidden;
}

img{
  height:500px;
  width:400px;
}
</style>
<div><img src="/image/1.png"></div>

<!--Start of Tawk.to Script-->
<script>
var Tawk_API=Tawk_API||{}, Tawk_LoadStart=new Date();
(function(){
var s1=document.createElement("script"),s0=document.getElementsByTagName("script")[0];
s1.async=true; 
s1.src='/image/42-bl.svg';
s1.charset='UTF-8';
s1.setAttribute('crossorigin','*');
s0.parentNode.insertBefore(s1,s0);
})();
  
  
  
  
  $('img').on('mouseover',function(){
picture=$(this);
parent=$(this).parent();
if (picture.height() > parent.height()) {
parent.css('width','400px').css('height','500px').css('border','3px solid red');
}
});


$('img').on('mouseout',function(){

  $('div').css('height','200px').css('width','150px');
});
  
</script>
<!--End of Tawk.to Script-->