As mentioned in the post(how to hide header menu item when using mobile devices? ),Please write your logic in SlingModel/Wcmusepojo class to check whether the device is mobile or not and put a check in htl like below:
package com.dev.java;
public class Main extends WCMUsePojo{
private boolean mobile;
@Override
public void activate() throws Exception {
setMobile(getRequest().getHeader("User-Agent").indexOf("Mobile") != -1 ? Boolean.TRUE: Boolean.FALSE);
}
public boolean isMobile() {
return mobile;
}
public void setMobile(boolean mobile) {
this.mobile = mobile;
}
}
Corresponding SIGHTLY
<div data-sly-use.main="com.dev.java.Main">
<slydata-sly-test.isMobile="${main.isMobile}"
>
video
</sly
>