Is it possible to have two pixastic-effected images on a single page?_问答_开发者

Is it possible to have two pixastic-effected images on a single page?

开发者 https://www.devze.com 2023-03-11 21:33 出处：网络

相关专题：blur pixastic

Simple, but specfic question. I have a site which is using Pixastic to blur images. There are two images on a page which need to be blurred. This seems to work fine in IE (which I believe is using filters on the images) but doesn't work on other browsers (Firefox/Chrome). In those browsers it just effects the second image and the first is replaced by nothing - so I just get a rendered page with one blurry image on it instead of two.

I'm using the jQuery selector, by the way. The code I'm using is basically just this:

<head>
<script type="text/javascript" src="js/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="js/pixastic.custom.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    $('.blur').pixastic('blurfast', {amount:0.2});
  });
</script>
</head>

<body>开发者_高级运维;
  <img src="img/title1.png" title="" class="blur" />
  <img src="img/title2.png" title="" class="blur" />
</body>

Does anyone know if it's possible to affect multiple images with Pixastic, and if so, how?

Thanks

As far as I can tell, what you have that should work.

Option 2. Try specifying a CSS class explicitly instead?

e.g. roughly something like:

<html>
<head>
<script type="text/javascript">
var pixastic_parseonload = true;
</script>
<script src="pixastic.core.js" type="text/javascript"></script>
<script src="invert.js" type="text/javascript"></script>
</head>
<body>
</style>
  <img src="img/title1.png" title="" class="pixastic pixastic-blurfast(amount=0.2)" />
  <img src="img/title2.png" title="" class="pixastic pixastic-blurfast(amount=0.2)" />
</body>
</html>