jQuery的翻轉與一些PHP

Question

我試圖得到一些翻車使用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變量是正是;特定縮略圖的網址。該thumbgen位做一些大小和顏色轉換。當他們在一起時，我給出了一個可以交換的w和彩色圖像的URL。我使用的是WordPress，所以我必須使用php，而不是僅指定圖像src，因爲尺寸和顏色轉換是爲用戶自動完成的。

第一個問題，在做內聯代碼這樣壞？其次。由於php的緣故，我正在努力爲翻滾編寫一個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（$後> ID））;

可你甚至結合在一個PHP和jQuery的？

感謝

Answer 1

可以簡化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中，使用data attribute：

$(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並恢復它。