Hello,
I have an HTML object and I would like to have a vertical scrol when I have reach the bottom of the Html control.
Any idea ?
Yves
Welcome to the nuBuilder Forums!
Register and log in to access exclusive forums and content available only to registered users.
Register and log in to access exclusive forums and content available only to registered users.
How to activate vertical scroll in HTML object Topic is solved
-
- Posts: 315
- Joined: Sun Mar 14, 2021 8:48 am
- Location: Geneva
- Has thanked: 87 times
- Been thanked: 11 times
How to activate vertical scroll in HTML object
You do not have the required permissions to view the files attached to this post.
-
- nuBuilder Team
- Posts: 4292
- Joined: Sun Oct 14, 2018 6:43 pm
- Has thanked: 71 times
- Been thanked: 444 times
- Contact:
Re: How to activate vertical scroll in HTML object
To add a vertical scrollbar to a div element, you can use the overflow-y property in CSS.
Here's an example:
You can also use auto instead of scroll if you want the scrollbar to appear only when necessary.
You can then apply this class to your div element in your HTML:
I hope this helps! Let me know if you have any questions.
Here's an example:
Code: Select all
.scrollable-div {
height: 200px; /* Set a fixed height for the div */
overflow-y: scroll; /* Add the scrollbar */
}
Code: Select all
.scrollable-div {
height: 200px; /* Set a fixed height for the div */
overflow-y: auto; /* Add the scrollbar only when necessary */
}
Code: Select all
<div class="scrollable-div">
<!-- Your content goes here -->
</div>
-
- Posts: 315
- Joined: Sun Mar 14, 2021 8:48 am
- Location: Geneva
- Has thanked: 87 times
- Been thanked: 11 times
Re: How to activate vertical scroll in HTML object
Thanks Kevin,
Where should I update the css ? and apply the class to my object ?
Many thanks and sorry I am beginner with nubuilder...
Yves
Where should I update the css ? and apply the class to my object ?
Many thanks and sorry I am beginner with nubuilder...
Yves
-
- nuBuilder Team
- Posts: 4292
- Joined: Sun Oct 14, 2018 6:43 pm
- Has thanked: 71 times
- Been thanked: 444 times
- Contact:
Re: How to activate vertical scroll in HTML object
The content of the HTML object must look like this:
Add the CSS in Form Properties -> Custom Code -> Style
Code: Select all
<div class="scrollable-div">
<!-- Your content goes here -->
</div>
-
- Posts: 315
- Joined: Sun Mar 14, 2021 8:48 am
- Location: Geneva
- Has thanked: 87 times
- Been thanked: 11 times
Re: How to activate vertical scroll in HTML object
Hello Kevin,
Tried to do your modifications without success unfortunately.
Behind the HTML control and behind the custom CSS on the form The output doesn't show any vertical scrollbar What is wrong ?
Thanks for your help,
Yves
Tried to do your modifications without success unfortunately.
Behind the HTML control and behind the custom CSS on the form The output doesn't show any vertical scrollbar What is wrong ?
Thanks for your help,
Yves
You do not have the required permissions to view the files attached to this post.
-
- Posts: 315
- Joined: Sun Mar 14, 2021 8:48 am
- Location: Geneva
- Has thanked: 87 times
- Been thanked: 11 times
Re: How to activate vertical scroll in HTML object
Solved. It was due to a typo in the nuSetValue behind Custom Field tab (onload event)