1

这是所有的javascript代码：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="assets/templates/default/_scripts/jquery.innerfade.js"></script>
<script type="text/javascript">
    $(document).ready( function(){
        $('.rotation ul').addClass('image_rotation');
        $('.image_rotation').css("display","block");
        $('.image_rotation').innerfade({
            speed: 'slow',
            timeout: 10000,
            type: 'sequence'
        });
    });
</script>
<script type="text/javascript">
 var save_url = "background-font-size-save.html"
 $(document).ready(function () {
  /*  Images: rotate, frame, shadow  */
  $('.rotation ul li img').each(function() {
    if ($(this).is(":first-child")) {
      var m_left=0;
      var m_top=0;
    }
    else {
      var m_left=0;
      var m_top=0;
      m_left = parseInt($(this).prev().attr("width")) + parseInt($(this).prev().css('margin-left'));
      if (parseInt(m_left)+parseInt($(this).attr("width")) > 430) {
        m_left=0;
        m_top=250-parseInt($(this).attr("height"));
      }
    }
    var r_rand = Math.floor(Math.random() * 10) - 5;
    $(this).css({'border':'5px #ffffff solid','border-radius':'10px','transform':'rotate('+r_rand+'deg)','-moz-transform':'rotate('+r_rand+'deg)','-webkit-transform':'rotate('+r_rand+'deg)','-ms-transform':'rotate('+r_rand+'deg)','box-shadow':'4px 4px 10px -3px #000000','position':'absolute','margin':m_top+'px 0 0 '+m_left+'px'});
  });
  /*  images end  */
  background(5);
  $('html').css('font-size', 14);
  var originalFontSize = $('html').css('font-size');
 });
 function background(n) { $('.wrap').css("background","url(assets/templates/default/images/bg"+n+".jpg)"); $.ajax({ type: "POST", url: save_url, data: { background: n } }); return false; }
 function big_font() {
  var currentFontSize = $('html').css('font-size');
  var currentFontSizeNum = parseFloat(currentFontSize, 10);
  var newFontSize = currentFontSizeNum*1.1;
  $('html').css('font-size', newFontSize);
  $.ajax({ type: "POST", url: save_url, data: { font_size: newFontSize } });
  return false;
 }
 function small_font() {
  var currentFontSize = $('html').css('font-size');
  var currentFontSizeNum = parseFloat(currentFontSize, 10);
  var newFontSize = currentFontSizeNum*0.9;
  $('html').css('font-size', newFontSize);
  $.ajax({ type: "POST", url: save_url, data: { font_size: newFontSize } });
  return false;
 }
</script>

我有几个图像，我想旋转，添加边框，阴影。但我也使用 jquery 插件来旋转 li 内容。html看起来像这样：

<div class="rotation">
 <ul>
  <li><img src=".." width=".." height=".." /></li>
  <li><img src=".." width=".." height=".." /><img src=".." width=".." height=".." /></li>
  <li><img src=".." width=".." height=".." /><img src=".." width=".." height=".." /><img src=".." width=".." height=".." /></li>
 </ul>
</div>

我遇到的问题是，如果我添加到每个图像阴影，旋转它，边框，使用这个 jquery 代码，每个 li 标签的内容不会消失并且它一直显示。如果我删除添加阴影、边框等的代码，它会同时显示一个 li 内容。这是为什么？如何在不损坏轮播的情况下将所有样式添加到每个图像中？

4

1 回答 1

0

您可能必须编辑插件并查找它如何/在何处生成元素的渲染并附加您的新样式。有些插件具有您可以传递的属性以进行自定义，有些则没有。

于 2013-03-08T17:30:50.140 回答