Question

我有一个滑块图像，我需要显示一些文本，因为图像颜色不恒定我必须使用jQuery更改文本颜色我一直在浏览这个问题而且我很少链接。

1）Dynamically adjust text color based on background image

2）## Demo on Fiddle ##（使用moototools，对我来说不起作用）

但它没有帮助我，在第一个链接中我看到了一个帖子，它让我了解了jQuery自适应背景插件。

This链接提供了有关adaptive-backgrounds-jquery-plugin的说明，它将更改父元素的背景颜色。

这是我更改父元素颜色的代码。我必须将其更改为文本颜色，但截至目前我无法更改背景颜色。有人能帮助我吗？

HTML：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link href='http://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'>
    <title>JQuery Adaptive Background Demo</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="jquery.adaptive-backgrounds.js"></script>
    <style>
    body {
        font-family: 'Ubuntu', serif;
        color:#444;
        font-size:1.6em;
        padding:0;
        margin:0;
    }
    .ad_container {
        margin-bottom: 20px;
        height: 100px;
        position: absolute;
        right: 0;
    }
    .page-slide {
        width: 100%;
        padding:30px 0;
        text-align: center;
    }
    img {
    }
    </style>
  </head>
  <body>
    <div class="page-slide">
      <img src="hallofgamers.jpg"  width="500" alt="Water" data-adaptive-background='1'/>
    </div>
    <div class="page-slide">
      <img src="Capture.JPG"  width="500" alt="Water 2" data-adaptive-background='1'/>
    </div>
    <hr />
    <p><a href="">Return To Article</a></p>
    <script>
    $(document).ready(function() {
        $.adaptiveBackground.run()
    });
    </script>
  </body>
</html>

如何使用jquery获得自适应背景？

0 个答案: