how to make a horizontal scrolling website

<div class="scrolling-wrapper"> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> <div class="card"><h2>Card</h2></div> </div> .scrolling-wrapper { overflow-x: scroll; overflow-y: hidden; white-space: nowrap; .card { display: inline-block; } }

Horizontal scroll on the web page.

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class HorizontalScroll {

    WebDriver driver;
    @Test
    public void ScrollHorizontally() {
   	    WebDriverManager.chromedriver.setup();
        driver = new ChromeDriver();

        JavascriptExecutor js = (JavascriptExecutor) driver;

        driver.get("URL");
        WebElement Element = driver.findElement(locator);

        //This will scroll the page Horizontally till the element is found		
        js.executeScript("arguments[0].scrollIntoView();", Element);
    }
}

Posted by: Guest on June-07-2021

Source

Code answers related to "how to make a horizontal scrolling website"

Code answers related to "CSS"

CSS Answers by Framework

Browse Popular Code Answers by Language

Answers for "how to make a horizontal scrolling website"

Code answers related to "how to make a horizontal scrolling website"

Code answers related to "CSS"

CSS Answers by Framework

Browse Popular Code Answers by Language

Popular Programming Languages

Advertisements

Company

Compilers

Help

Connect with us