应用Ajax实现无刷新地，每隔10分钟从数据库获取一次最新公告，并滚动显示。 显示内容在如下图上。

好的，针对您的问题，我可以为您提供一个基本的思路：

1. 使用 Ajax 定时向后端请求最新公告数据；

2. 后端将最新的公告数据以 JSON 格式返回给前端；

3. 前端通过 JavaScript 解析 JSON 数据，并将其显示在页面上；

4. 使用 CSS3 的动画效果实现公告滚动的效果。

下面是一个简单的实现示例：

HTML 代码：

<div id="notice"></div>

JavaScript 代码：

function getNotice() {
  $.ajax({
    url: '/api/notice',
    type: 'GET',
    dataType: 'json',
    success: function(data) {
      var html = '';
      for (var i = 0; i < data.length; i++) {
        html += '<div class="notice-item">' + data[i].title + '</div>';
      }
      $('#notice').html(html);
    }
  });
}

$(document).ready(function() {
  // 页面加载完成后立即获取最新公告数据
  getNotice();

  // 每隔 10 分钟获取一次最新公告数据
  setInterval(function() {
    getNotice();
  }, 600000);
});

CSS 代码：

#notice {
  height: 30px;
  overflow: hidden;
  position: relative;
}

.notice-item {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  animation: notice-scroll 10s linear infinite;
}

@keyframes notice-scroll {
  0% {
    opacity: 0;
    transform: translate(0, 0);
  }
  5% {
    opacity: 1;
    transform: translate(0, 0);
  }
  25% {
    opacity: 1;
    transform: translate(0, -30px);
  }
  30% {
    opacity: 0;
    transform: translate(0, -30px);
  }
}

这里的 JavaScript 代码使用了 jQuery 库来发起 Ajax 请求，CSS 代码使用了 CSS3 的动画效果来实现公告滚动的效果。当然，这只是一个简单的实现示例，实际情况中可能需要根据具体需求进行调整。