1

我正在尝试使用 jQuery 进行一些翻转。问题是必须使用一些 php 代码来获取图像源。

如果我使用 javascript 像这样内联它，它可以工作：

<a href="<?php the_permalink(); ?>"
   <?php $thumburl = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
   onmouseover="document.roll<?php the_ID(); ?>.src='<?php thumbGen($thumburl,300,0,1,0,0); ?>'"
   onmouseout="document.roll<?php the_ID(); ?>.src='<?php thumbGen($thumburl,300,0,1,0,1); ?>'"
   <img src="<?php thumbGen($thumburl,300,0,1,0,1); ?>" name="roll<?php the_ID(); ?>"/>
</a>

$thumburl 变量就是这样；特定缩略图的 url。thumbgen 位进行一些大小和颜色转换。当他们在一起时，他们给了我一个黑白和彩色图像的网址，可以交换。我正在使用 WordPress，所以我必须使用 php 而不仅仅是指定图像 src，因为大小和颜色转换是自动为用户完成的。

第一个问题，像这样做内联代码很糟糕吗？第二。由于 php.ini 的原因，我正在努力为翻转编写一个 jQuery 函数。我想它会是这样的：

$(document).ready(function() {
   $('.project img').hover(
    funcation(){
    this.src = '<?php thumbGen($thumburl,300,0,1,0,1); ?>';},
    function (){
    this.src = '<?php thumbGen($thumburl,300,0,1,0,1); ?>';});

但我不知道在哪里包括这个： $thumburl = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );

你甚至可以将 php 和 jQuery 合二为一吗？

谢谢

4

1 回答 1

0

您可以像这样简化 PHP：

<a href="<?php the_permalink(); ?>"
   <?php $thumburl = wp_get_attachment_url( get_post_thumbnail_id($post->ID) ); ?>
   <img src="<?php thumbGen($thumburl,300,0,1,0,1); ?>" data-hover="<?php thumbGen($thumburl,300,0,1,0,0); ?>" />
</a>

然后使用该数据属性在 jQuery 中执行类似的操作：

$(function() {
   $('.project img').each(function() { 
     $.data(this, 'orig', this.src); 
   }).hover(function() {
     this.src = $(this).attr('data-hover');
   }, function () { 
     this.src = $.data(this, 'orig');
   });
});

src这样做是使用 存储每个图像的原始图像$.data()，然后在悬停时我们抓取src我们存储的任何新属性data-hover（我们创建的数据属性），当悬停时我们获取原始图像src并恢复它。

于 2010-09-26T10:26:10.793 回答