使 div 处于活动状态而不单击其中的某个位置 [英] Make a div active without clicking somewhere in it

查看:21
本文介绍了使 div 处于活动状态而不单击其中的某个位置的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在我构建的页面上使用水平滚动.它在一个 div 内,用一个类命名,我想使用箭头键来滚动.为了让它随键滚动,我需要点击它的某个地方.

是否可以在第一次加载页面时直接使用这些键而不必点击它?

如果可能的话,我需要方向键直接起作用并在该特定 div 内开始水平滚动.

.scroll { grid-template-columns: repeat(15,1fr);溢出-x:滚动;滚动快照类型:x 接近度;}

    <div class="容器"><img src="ok.png"><div class="inmiddle"><div class="描述">blablabla

</div></li></ul>

解决方案

如果你可以使用这个简单的 JS:

document.getElementById('scroll').focus();

<div id="滚动">例子

否则将伪类 :active 添加到您的 div.

您也可以根据需要更改此伪类的属性.

有用的文档

I use a horizontal scroll on a page I built. It's inside a div, named it with a class, and I want to use the arrows keys to scroll. For it to scroll with the keys, I need to click somewhere on it.

Is it possible to use the keys directly on first load of the page without necessarily clicking it?

I need the arrow keys to be functional directly and start the horizontal scroll inside that particular div, if that's possible.

.scroll { grid-template-columns: repeat(15,1fr); overflow-x: scroll; scroll-snap-type: x proximity; }

<ul class="scroll"> <div class="container"> <img src="ok.png"> <div class="inmiddle"> <div class="description"> blablabla</div> </div> </div></li></ul> 

解决方案

If you can just use this simple JS:

document.getElementById('scroll').focus();

<body> 
  <div id="scroll">
    example      
  </div> 
</body>

Otherwise add the pseudo class :active to your div.

You can also change the properties to this pseudo class as you need.

Useful documentation

这篇关于使 div 处于活动状态而不单击其中的某个位置的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆