下面是一个使用canvas.drawImage和canvas.style移动背景图片的示例代码：

HTML部分：

JavaScript部分（script.js）：

const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');

// 创建一个Image对象来加载背景图片
const backgroundImage = new Image();
backgroundImage.src = 'background.jpg';

// 背景图片的初始位置
let bgX = 0;

// 绘制背景图片的函数
function drawBackground() {
  ctx.drawImage(backgroundImage, bgX, 0);
}

// 移动背景图片的函数
function moveBackground() {
  bgX -= 1; // 移动1个像素
  if (bgX <= -canvas.width) {
    bgX = 0; // 当背景图片移动到画布左侧时，重置位置
  }
}

// 渲染函数，用于每一帧更新画布
function render() {
  ctx.clearRect(0, 0, canvas.width, canvas.height); // 清空画布
  moveBackground(); // 移动背景图片
  drawBackground(); // 绘制背景图片
  requestAnimationFrame(render); // 循环渲染
}

// 加载完成背景图片后开始渲染
backgroundImage.onload = function() {
  render();
};

上述代码会在canvas中绘制一张背景图片，并不断地向左移动，当背景图片移出画布左侧时重新出现在画布右侧，实现了无缝循环滚动的效果。请将background.jpg替换为你自己的背景图片路径。