javascript - 纯 javascript 中的水平日历今天日期突出显示

Question

我最近一直在开发一个移动应用程序，为此我必须从头开始编写日历。我必须在父 div 的滚动区域中显示日期。我希望日期先出现，而不是隐藏在滚动区域中。 请帮助我如何在浏览器的可见部分中提取今天的日期

<div class="calendar">
<div class="scroll-dates">
 <ul>
   <li>Sun</li>
   <li>01</li>
 </ul>
 <ul>
   <li>Sun</li>
   <li>01</li>
 </ul>
 <ul>
   <li>Mon</li>
   <li>02</li>
 </ul>
 <ul>
   <li>Tue</li>
   <li>03</li>
 </ul>
 <ul>
   <li>Sun</li>
   <li>01</li>
 </ul>
 <ul>
   <li>Wed</li>
   <li>04</li>
 </ul>
 <ul>
   <li>Thu</li>
   <li>05</li>
 </ul>
 <ul>
   <li>Fri</li>
   <li>06</li>
 </ul>
 <ul>
   <li>Sat</li>
   <li class="today">07</li>
 </ul>

</div>
</div>

Answer 1

我觉得你就是这样的looking for. (jsfiddle)

你可以用offsetTop得到你要找的div的偏移量，用scrollTop移动父div的滚动位置:

var offset = $("#container").find("div[day='"+today.toDateString()+"']")[0].offsetTop;
$("#container")[0].scrollTop = offset;

还有一个scrollLeft和offsetLeft。小心，因为偏移量是相对于 body 元素的。 (有一个属性 offsetParent)。 要在控制台中查看属性，请尝试:

console.dir($("#container")[0]);