Pictures, Videos in section 4 "row formats" not responsive, why?
Autor: József Z.
Visitado 1355,
Followers 1,
Compartido 0
Pictures, Videos in section 4 "row formats" not responsive, why?
Would be great to rebuild section 4 "row formats" as you have in section 2 "template structure" cuz when I put video or image in section 4 "row formats" as background the video/image will not be visible fully in lower resolutions, only some part of the video/image, so it does not make sense to have that option at all.
With the "fit to window" option, the image should always fit the window in all resolutions with the entire image.
Publicado en
(It > En) ... you need to know the concept of responsive in CSS COVER mode...
... if you are interested in rational downsizing, another story, ... here is my simple trick:
> https://helpcenter.websitex5.com/es/post/243912
... you can use the same two PNG images of mine for rehearsing...
.
ciao
.
Autor
KolAsim thanks for your helpfulness, but unfortunately it does not work for me.
Only solution with your method is put the row background image with the lowest possible (mobile) resolution, so your 800x450 image need to be rescaled to 320x180, but in this case in desktop resolution the image will look pixelated and blurry.
If I had to rewrite the css file for the solution, the question arises: why do I need websitex5?
I guess WebsiteX5 developers can simply add the responsive feature also in section 4-row formats, just as they added it in section 2-template structure.
József, can you supply a link to what you currently have on that page? Depending on what is in the cell I have previously successfully created a row/formats background that scaled by placing a transparent image in an object.
Autor
Thanks for your time Esahc.
I have uploaded a sample image but you can see my problem live at www.smartblast.ie
On the home page take a look to the row image list background. When you go down to 720px or even to 320px resolution you can see only the small part of the original picture cuz "row formats" section is not responsive in website x5.
Try to disable the "Full-height" you have set for the page.
Take a look here: https://www.bramminginfo.dk/bygninger.html
I have a "slideshow" in row format and then a image-object. The image is made fully transparent when hovered.
Try to resize the browser and see how it adats to the window.
The image could have been an "empty" png, so that the background would always be visible.
Or it could have been an image (eventually png) with some text.
Important is that you have an object that keeps its ratio by resizing as an image does.
Here: https://www.bramminginfo.dk/b.-hovedgard.html I have a row-format "slideshow" where a png-image with text is put in an image-object in that row.
The text is made to appear when hovered.
Again: try to resize the browser and see how smooth the row-format "slideshow" adapts the screen.
Hi József Z.,... (It > En) ... ...my original and exclusive invention of a few years ago, which I posted to you in the previous link, was then used by many users for the intended purpose...
... the aim is to make responsive, with rational resizing, so to speak with respect for the aspect ratio, for example (3:2) or (16:9), etc., ... for the video background of a row, or for one line background slideshow,,,
... I repeat, of a row (1 row), which must contain a single cell, therefore with a single Imagine Object with a transparent image in the desired ratio (see and download my images that have made school)...
... in this way the background will always be full width and full visibility in all resolutions ...
... to achieve this, you need to extend the line and also the Image Object to full width of the layout ...
...!... from your STAMP (screenshot) I notice that you have not extended the Image Object...!...
>> Step 4 | Row Formats window | [+] General section:
> Extend to the width of the browser window
>> Step 4 | Page Creation | [+] toolbar commands:
> Extend
.
Hello, ciao
,
József, please check out John's suggestions (& KolAsim also responded while I was composing my post)
You might also wish to make use of the techniques in the attached iwzip
On the home page I added a transparent image (you can of course add text, logo, etc to the image) and used the row formats image list as a background slide show. Using the transparent image in this way constricts the slide show so it zooms proportunate to the width available.
On page 1 I used a simple text object with multiple tabs to create a slide show.
In both case you can also use the cell style.
Here you can use the text tab to overlay title, logo and text, but be warned, this can break the enforced ratio to some extent.
These suggestions are not what you asked for (apologies), but they may give you options.
Of course if Incomedia would implement the option to hide objects at desktop resolution as frequently requested we could simply hide the troublesome object at mobile resolutions and unhide an alternative.
Have fun :-)
Autor
Thanks for your time guys I really appreciate your willingness to help.
John's advice works if you use only an image as object, but if you want to use text object or any other object it does not. So unfortunately it is not a solution for my problem :(
John, in your website the text what you have there is not a text, it is an image which shows a text.
Yes - I know