Hello everybody,
I’m looking for a code that can auto adjust a paragraph/text by the width of the screen. without changing the font size etc.
Exactly like the first stripe of this demo https://www.wixproisrael.com/demo1
The owner @ בונה אדריכלים ומעצבים doesn’t answer so if you have any clue. Don’t hesitate.
Thank you very much !
Be aware that old post from 2018 is in the Community Feature Request which is where you ask for a feature to be added to future releases etc, whilst all issues related to code should be in this part of the Corvid Forum.
Anyways, the answer is in that same post and has been explained by at least two people around your bump up of the old thread.
Amshu Rak
Simply amazing, works like a charm! Thanks man, you are a legend. @Sam Brown - Add a text element to a container and paste his code in the onReady() function. Just make sure to get the reference to the text element correct.
Calum
Guys and girls, Copy and paste the below code into your code for PAGE - note it is onReady so should be at the top of all code.
$w.onReady(function () {
//TODO: write your page related code here...
var style1 = "vh;height:" + 100 + "vh"; $w("#text1").html = "<" + "h1" + " style=" + style1 + ">" + $w("#text1").text + "</" + "h1" + ">";
});
Create a text element and position it inside a strip (make sure this text element is called “text1”)
Calum
Solved and explained.
For those who are not code guru’s but enjoy learning it (much like myself). By using the code below you can dynamically set the height of strips.
Add a text box element to the strip and bound it to the top and bottom (click and drag the height to bound to the strips upper and bottom edges).
The code below is explained as:
h1 = Style of text, i.e. in this case Header1, so if you change this style to match your strip your can make the text seem invisible.
When you don’t want to set the height of the strip to the full page (maybe you have a floating header like me…) calculate the percentage to set the strip height. My header is made of two 65px high strips and also takes into account a scroll strip which acts as a viewport enter / leave for me of 15px.
Take the 1080 screen size minus the 145 and this gives us the number of pixels our strip should fill. Work this out as a percentage of 1080 and enter as the height. Mine was 86.57. Works a treat.
$w.onReady(function () {
var style1 = "vh;height:" + 86.57 + "vh"; //change 86.57 to whatever you calc
$w("#text1").html = "<" + "h1" + " style=" + style1 + ">" + $w("#text1").text + "</" + "h1" + ">";
});
Hello GOS,
I did use this code :
$w.onReady( function () {
var style1 = “vh;height:” + 100 + “vh”; $w(" #text1 “).html = “<” + “h1” + " style=” + style1 + “>” + $w(" #text1 ").text + “</” + “h1” + “>”;
});
It allows you to have a responsive strip. What I wanted to know is which code did he put for his demo to have a paragraph that varies by the screen size without changing font size.
https://www.wixproisrael.com/demo1 It is a different question and this solution is in front of my eye, but I didn’t find the code source anywhere.
Thank you very much for your further instruction.