Multi-gravist of automatic generation of JS automatic generation
This example is demonstrated when the image is loaded, and it will often encounter a large picture that customers upload, but if the marked high and woker is displayed, due to the shape of the picture when it is displayed. Different will cause deformation, here to solve this problem with a small footprint, you can modify it more universal, such as adding the wa_setimgautosize () function, then send it in the οnlοad = event in the picture. To call the function yourself.
->
Demo Picture isometric to reduce </ Title></p>
<p><script></p>
<p>Function wa_setimgautosize ()</p>
<p>{</p>
<p>Var img = document.all.img1; // Get pictures</p>
<p>Var maxWidth = 200; // Set the image width limit</p>
<p>Var maxheight = 100; // Set the image height limit</p>
<p>Var heightwidth = img.offsetheight / img.offsetwidth; // Set aspect ratio</p>
<p>Var widthheight = img.offsetwidth / img.offsetheight; // Set a high ratio</p>
<p>IF (img.readystate! = "complete") Return False; / / Make sure the picture is fully loaded</p>
<p>IF (img.offsetwidth> maxwidth) {</p>
<p>Img.width = maxwidth;</p>
<p>Img.height = MaxWidth * HeightWidth;</p>
<p>}</p>
<p>IF (IMG.OffSetheight> maxheight) {</p>
<p>Img.height = maxheight;</p>
<p>Img.width = maxheight * widthheight;</p>
<p>}</p>
<p>}</p>
<p></ script></p>
<p></ HEAD></p>
<p><Body></p>
<p><img src = "" Border = 0 ID = "img1" οnlοad = "wa_setimgautsize ();">>>></p>
<p><br></p>
<p><Input ID = INP TYPE = "File" onpropertychange = "img1.src = this.value;">></p>
<p></ Body></p>
<p></ Html></p></div><div class="text-center mt-3 text-grey">
转载请注明原文地址:https://www.9cbs.com/read-64730.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>)
</div><div></div></div></div><ul class="postlist list-unstyled">
</ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="64730" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved
</div><div class="col text-right">Processed:
<b>0.046</b>, SQL:
<b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script>
var debug = DEBUG = 0;
var url_rewrite_on = 1;
var url_path = './';
var forumarr = {"1":"Tech"};
var fid = 1;
var uid = 0;
var gid = 0;
xn.options.water_image_url = 'view/img/water-small.png';
</script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script>
var forum_url = 'list-1.html';
var safe_token = 'nwuPIPTPMGy7AvgpUy70hQUo1wmp_2FsejAYVZvKAK_2F1R2gAnkfMgoJPMiZzghT9urs2gbxdqeevqE6Z4w';
var body = $('body');
body.on('submit', '#form', function() {
var jthis = $(this);
var jsubmit = jthis.find('#submit');
jthis.reset();
jsubmit.button('loading');
var postdata = jthis.serializeObject();
$.xpost(jthis.attr('action'), postdata, function(code, message) {
if(code == 0) {
location.reload();
} else {
$.alert(message);
jsubmit.button('reset');
}
});
return false;
});
function resize_image() {
var jmessagelist = $('div.message');
var first_width = jmessagelist.width();
jmessagelist.each(function() {
var jdiv = $(this);
var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width();
var jmessage_width = Math.min(jdiv.width(), maxwidth);
jdiv.find('img, embed, iframe, video').each(function() {
var jimg = $(this);
var img_width = this.org_width;
var img_height = this.org_height;
if(!img_width) {
var img_width = jimg.attr('width');
var img_height = jimg.attr('height');
this.org_width = img_width;
this.org_height = img_height;
}
if(img_width > jmessage_width) {
if(this.tagName == 'IMG') {
jimg.width(jmessage_width);
jimg.css('height', 'auto');
jimg.css('cursor', 'pointer');
jimg.on('click', function() {
});
} else {
jimg.width(jmessage_width);
var height = (img_height / img_width) * jimg.width();
jimg.height(height);
}
}
});
});
}
function resize_table() {
$('div.message').each(function() {
var jdiv = $(this);
jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>');
});
}
$(function() {
resize_image();
resize_table();
$(window).on('resize', resize_image);
});
var jmessage = $('#message');
jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); });
jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); });
$('#nav li[data-active="fid-1"]').addClass('active');
</script>
