使用一些php进行jQuery翻转
使用一些php进行jQuery翻转
提问于 2010-09-26 18:20:03
我正在尝试使用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位执行一些大小和颜色转换。当他们在一起时，他们给我一个黑白和彩色图像的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($post->ID) )；
你能把php和jQuery合二为一吗？
谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2010-09-26 18:26:11
您可以像这样简化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>然后，使用该data attribute在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');
});
});这样做的目的是使用$.data()存储每个图像的原始src，然后在悬停时获取任何新的src属性，并将其存储在data-hover (我们创建的数据属性)中，当悬停时，我们将获取原始src并恢复它。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/3797363
复制相关文章
相似问题
腾讯云开发者
