High score help: HTML page pictures are automatically set to display according to the original size. If it exceeds the set value, it will be compressed and displayed. Please help_html/css_WEB-ITnose

HTML image

The page image address is: http://www.cdlovelife.com/public/info.php?id=12947
It seems that the resolution is poor, and the length and width are compressed It's very ugly.
The page source code is as follows:

<div class="cont_main" style="background-color: rgb(242, 251, 255);">   <b>介绍：</b> {$info.content}    <ul class="pic_list clearfix">    {foreach from=$image item=image}    <li><a href="{$image.path}" target="_blank"><img  class="postinfoimg lazy"  src="/static/imghwm/default1.png"  data-src="{$mymps_global.SiteUrl}{$image.prepath}"       style="max-width:90%"  style="max-width:90%"/ alt="High score help: HTML page pictures are automatically set to display according to the original size. If it exceeds the set value, it will be compressed and displayed. Please help_html/css_WEB-ITnose" ></a></li>    {/foreach}    </ul></div>

The effect I need is like that of Ganji.com, when pictures with smaller resolutions are automatically displayed according to the original image, set table
to exceed If necessary, compress the display, or display it partially, in short, it should be beautiful.

Please give me some code, thank you! The score is no problem, I will add it, haha

Reply to the discussion (solution)

Take

width as Accurate


 <div class="cont_main" style="background-color: rgb(242, 251, 255);">   <b>介绍：</b>      <ul class="pic_list clearfix" id="pic_list">     <li>    	<a href="http://www.cdlovelife.com/dat/upload/information/201307/13747304051jz9w.jpg" target="_blank">    		<img  class="postinfoimg lazy"  src="/static/imghwm/default1.png"  data-src="http://www.cdlovelife.com/dat/upload/information/201307/13747304051jz9w.jpg"    / alt="High score help: HTML page pictures are automatically set to display according to the original size. If it exceeds the set value, it will be compressed and displayed. Please help_html/css_WEB-ITnose" >    	</a>    </li>     </ul></div><script>  var imgList=document.getElementById('pic_list');  var imgs=imgList.getElementsByTagName('img');  var w=imgList.offsetWidth;  for(var i=0;i<img  class="postinfoimg lazy"  src="/static/imghwm/default1.png"  data-src="{$mymps_global.SiteUrl}{$image.prepath}" s.length;i++){  			imgs[i].onload=function(){  				console.info( this.width,this.height )	  				if( w < this.width ) this.width=w;  			}  }</script alt="High score help: HTML page pictures are automatically set to display according to the original size. If it exceeds the set value, it will be compressed and displayed. Please help_html/css_WEB-ITnose" >	

Put it in the page code to report an error, it’s strange

Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload=function(){ console.info( this.width,this.height ) if( w

Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload= function(){ console.info( this.width,this.height ) if( w console.info( this. width, this.height ) Remove this sentence


Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[ i].onload=function(){ console.info( this.width,this.height ) if( w console .info(this.width,this.height) Remove this sentence


Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload=function(){ if( w
Should this function be defined in Smarty.class.php?



Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload=function (){ console.info( this.width,this.height ) if( w console.info( this.width , this.height ) Remove this sentence


Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i ].onload=function(){ if( w
Does this function need to be defined in Smarty.class.php?
Isn’t this JS treated as PHP?





Fatal error: Smarty error: [in C:/cdlovelife/template/default/info. html line 86]: syntax error: unrecognized tag: imgs[i].onload=function(){ console.info( this.width,this.height ) if( w console.info(this.width,this.height) Remove this sentence


Fatal error: Smarty error: [in C:/cdlovelife/template /default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload=function(){ if( w
Should this function be defined in Smarty.class.php?
Shouldn’t this JS be treated as PHP?

So how should this be handled?





Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload=function(){ console.info( this.width,this.height ) if( w  console.info( this.width,this.height ) 这句去掉 


Fatal error: Smarty error: [in C:/cdlovelife/template/default/info.html line 86]: syntax error: unrecognized tag: imgs[i].onload=function(){ if( w 
是不是这个函数要定义在Smarty.class.php里面？
不是是把这JS当做PHP处理了吧

那这个应该怎样处理？

这替换你1楼那段HTML，如果还会出错把 <script>...</script> 放到