在Ruby on Rails中旋转图像，类似于AJAX

Question

我正在一个网站上工作，我想在用户在页面上时循环图像，类似于幻灯片。 我四处搜寻，但未能找到领先优势。

有没有人用Rails和它支持的Javascript框架做到这一点？

Answer 1

你可以使用jquery循环插件，这里是链接： http ： //malsup.com/jquery/cycle/ 。 看起来它会做你想要的。

Answer 2

仅供参考，Rails并不特别依赖任何JS框架，即使它带有开箱即用的原型。

我假设当你说AJAX时，你并不是指AJAX。 如果您要使用AJAX旋转图像，则可以将旋转后的图像生成服务器端并发送到客户端，因为AJAX =使用javascript执行请求。 </迂腐>

话虽如此，您可以使用谷歌上可以找到的任何JS图像旋转器。

编辑：哦，你的意思是骑自行车穿过图像，而不是旋转它，例如顺时针旋转90度等（？）

Answer 3

我一直在使用这个非常简单的功能。 它不使用任何框架，它不会在幻灯片之间淡出，但它应该让你开始。

function SlideShow( elem_id, hold_time )
{
  this.elem = document.getElementById( elem_id );
  this.slides = [];
  this.num_slides = 0;
  this.cur_slide = 1;
  this.add_slide = function( image )
  {
    this.slides[ this.num_slides++ ] = image;
  }
  var self = this;
  this.next_slide = function()
  {
    if ( self.num_slides > 1 )
    {
      self.elem.src = self.slides[ self.cur_slide++ ].src;
      if ( self.cur_slide == self.num_slides )
        self.cur_slide = 0;
    }
  }
  setInterval( self.next_slide, hold_time )
}

参数是img标签的element_id和显示每张幻灯片的mS数。

add_slide函数接受JavaScript Image对象。

将cur_slide初始化为1的原因是因为我预先加载了第一个图像的img标签。

在我的应用程序中，我在window.onload方法中创建了幻灯片，并安排每个Image在加载幻灯片时将其自身添加到幻灯片中。

示例（未经测试）：

window.onload = function() {
  var slide_show = new SlideShow( "slide_image", 4000 )

  { var img = new Image();
    img.onload = function(){ slide_show.add_slide(img); };
    img.src="/images/slide1.jpg"; }
   ...
   /* Repeated for each image */
}

只有在不关心幻灯片的顺序时，此方法才有效。

Answer 4

我假设你想对图像进行持久的更改。 我正在开发一个Rails应用程序，我们实现了类似于snipshot.com中的功能的调整大小，裁剪和旋转

在技​​术方面，我们使用YUI调整大小并在用户界面中裁剪，在服务器上使用RMagick来处理图像并将结果发送回UI。 YUI提供了开箱即用的imagecrop小部件。

我们还考虑在UI中执行一系列操作，然后提交服务器端处理的最后结果，但这会导致结果不充分。