Posted by: Matthew Cox Jan 7 2012, 11:17 AM
I've set up a blog: www.madetobelieve.com
When you click through to a topic at the top of the page the images are stretched and distorted. I can't find out how to change this.
Please help
Matt
Posted by: Darin McGrew Jan 7 2012, 09:30 PM
Actually, that's just a frameset for http://hellothanksforvisiting.blogspot.com/
Which images are stretched and distorted? I didn't notice anything offhand.
Posted by: Christian J Jan 7 2012, 10:45 PM
I think the OP means an image like http://3.bp.blogspot.com/-QdfEhHfpuLA/Tu5k4V09rMI/AAAAAAAAAF8/dtMZqV_0tig/s320/idea+coverage.jpg, which is zoomed in http://hellothanksforvisiting.blogspot.com/search/label/Concepts but not http://hellothanksforvisiting.blogspot.com/2011/12/campaign-opinion-piece-internal.html.
Posted by: pandy Jan 7 2012, 10:58 PM
The size is correct in the HTML. The only thing I find is this.
CODE
.entry img{
float:left;
margin:0px 10px 10px 0px;
max-width:490px;
padding:5px;
background:#000;
}
But max-width shouldn't force that width and AFAIK it doesn't. The number is right though. The image is displayed at 490 pixels width.
Posted by: pandy Jan 7 2012, 11:09 PM
Ah! It's this.
CODE
<script type='text/javascript'>
var thumbnail_mode = "float-left";
summary_noimg = 375;
summary_img = 375;
img_thumb_width = 500;
</script>
I don't know what's done with that, but there it is. I tried changing it to a smaller value and the image shrank. Some other snip of JavaScript probably uses the above to set the width of all images in previews to 500px, then the max-width takes over and reduces it to 490px.
Posted by: pandy Jan 7 2012, 11:26 PM
It's used here, in a script block further down.
CODE
if(img.length>=1) {
imgtag = '<div class="postimg"><img src="'+img[0].src+'" width="'+img_thumb_width+'px"/></div>';
...
Posted by: Matthew Cox Jan 8 2012, 04:23 PM
QUOTE(pandy @ Jan 7 2012, 11:26 PM)
It's used here, in a script block further down.
CODE
if(img.length>=1) {
imgtag = '<div class="postimg"><img src="'+img[0].src+'" width="'+img_thumb_width+'px"/></div>';
...
Darn I've tried changing it to something like:
<script type='text/javascript'>var thumbnail_mode = "float-left" ;
summary_noimg = 175;
summary_img = 175;
img_thumb_width = 200;
</script>
Although nothing changed....... Christian J was totally correct about the issue and it's the same across all blogging categories. Just trying to make the images appear in the size as they are uploaded.
Posted by: pandy Jan 8 2012, 10:12 PM
I viewed source of your page and saved it locally. Hooked it up to blogspot with BASE href, changed img_thumb_width to something smaller and the image shrunk according to the number I entered.
Posted by: Matthew Cox Jan 10 2012, 04:08 PM
QUOTE(pandy @ Jan 8 2012, 10:12 PM)
I viewed source of your page and saved it locally. Hooked it up to blogspot with BASE href, changed img_thumb_width to something smaller and the image shrunk according to the number I entered.
Awesome - it has worked, thank you very much Pandy !!!!!