A bug while inserting an image to glossary and making it smaller on FF...
under mooodle 1.9.2 I'm trying to insert a picture (I tried JPG) when I'm adding a new entry to the glossary.
I'm trying to make it smaller with the arrow - it does turn smaller but after clicking on "save changes " I see the entry as the large original size
like it was before making it small and inserting it to the "definition"
it happened only on Firefox 3
and on IE it was fine.
is it a bug?
please help thanks.
YOU CAN SEE 3 PICS ABOUT THAT
THANKS
תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Hi Miki,
I presume you are resizing the image by dragging on the handles that appear on the image while editing. This will not resize the image, although temporarily when editing, it appears as if it does. If you want to display a smaller version of the image in the glossary, you will have to use a photo editor to resize your original image, save it under a different name (so your original remains intact) and then insert the smaller image into the glossary.
Matt
תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
well I have to correct you because by doing the same resizing thing on IE it does succeed and does work
which mean the image saved well to a smaller size after saving
Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
I don't know why those "handles" appear to make one think that you can resize an image in the HTML editor. You can't! This is weird, if you resize it, the HTML editor adds something like this in the HTLM code of the <img> tag:
style="width: 302px; height: 187px;"
This will not work, because an image size parameters are simply the width= and height= values inserted inside its <img> tag.
There are 2 ways to achieve what you want:
- recommended: resize the image (before uploading it to moodle) using a photo editor (in a pinch you can use picnic, an online photo editor which allows to resize, crop etc.)
- in a pinch, insert your image, then click on the Toggle HTML Source button; in the source, change (or add) the width paramater to the value of your choice. If you want the resized image to keep its original proportions, only enter a value for width and remove the height parameter altogether.
Joseph
תשובה ל: Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
thanks for the replies
again under IE it does shrink them without me shrinking them in a photo editor, but moodle itself.
I'm just curious, does it resize when you try it on IE?
let me know
thanks
Re: תשובה ל: Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Hi Miki,
As Joseph has said, you cannot resize an image in the HTML editor. What you are doing is introducing some extra markup that tells the client's browser to display the image with a certain style ( for example: style="width: 302px; height: 187px;" ). The image then appears smaller, but you have not altered the image itself. You still have the same large image (and the associated file size overhead), with some extra markup telling your visitors' browser to display the image within (smaller) width and height parameters.
I understand what you are saying, and understand the effect you are getting. Experimenting with this, the editor in IE and Firefox will accept the extra style into the markup, and sometimes, on saving, will strip out this extra markup. This results in the image displaying in its original large size.
You can make a browser display a large image in a small way, but to edit the image, you must use a photo editor. The html editor in Moodle cannot do this.
Matt
Re: תשובה ל: Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Yes it can, but you have to go inside the HTML code and do it "by hand", as explained in my post. You cannot do it the WYSIWYG way.
Joseph
Re: תשובה ל: Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Hi all,
My point is that the html editor has not altered the image, it cannot. It can put in markup that tells the browser to display a large image in a small way, but it does not alter the image itself.
The danger here is that people will post big images (big in dimensions and big in file size) and simply use the 'handles' in the editor to resize the image. Everything displays fine, but behind the scenes, an image that only needs to be, say 200x200, and 10kb in size is actually 600x600 and 700kb in size.
If you have a visitor to your site on a dialup, and they display the first 10 entries to the glossary, and this is happening with even one or two entries, the page will be slow to load.
I think that if you want to display a 200x200 version of an image, then you should (must, from an accessibility and usability point of view) edit and save a version of your image with these dimensions and quality. Here is exactly the same image, being called from the same place, but displaying in 2 different ways. I resized the second one by dragging the handles, but I did not alter the image, only the instructions I give to the browser about displaying it:
Matt
Re: תשובה ל: Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Hi Miki,
Just tried again and, you are right, resizing an image in the HTML editor in MSIE (7) and saving it does keep the new size parameters. Please note, however, that the "resizing handles" do not enable you to make a proportional resizing, so if you are not careful you can easily destroy the normal proportions of the image when resizing it.
Curiously, in FireFox, the "resizing handles" do enable you to make a proportional resizing, plus the values of the new sized are displayed. This is good, except that the resized values are not saved upon saving.
Looks like it's impossible to have the best of both worlds.
In attached screen shot:
- original image
- in FireFox (3) : resizing is proportional... but you cannot save resized image
- in MSIE (7): resizing is not proportional
- in MSIE (7): you can save resized image (but it may be distorted)
Re: תשובה ל: Re: תשובה ל: Re: תשובה ל: A bug while inserting an image to glossary and making it smaller on FF...
Dave asked the same question in Editor forum http://moodle.org/mod/forum/discuss.php?d=108048 and although current HTMLArea can not resize images you could change the height and width of images with some previous versions of moodle and HTMLArea in FF (just tested with an old 1.6) and other editors like TinyMCE and FCKEditor can still do it - with extra plugins it is even possible to change the real height and width of images with editor just like in offline image editors - but not with current HTMLArea... so it's clearly a new FF bug. Should we add this to tracker (or just "let it beee..." in HTMLArea)? I'm not sure if this is an editor issue or a filter issue (XHTML...)
For example http://www.phpletter.com/Demo/Tinymce-Ajax-File-Manager/ is a free online image editor plugin for TinyMCE and FCKEditor - advanced image editor plugin itself could be a nice new feature in moodle 2.X http://moodle.org/mod/forum/discuss.php?d=110902#p487598