首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >使用一些php进行jQuery翻转

使用一些php进行jQuery翻转
EN

Stack Overflow用户
提问于 2010-09-26 10:20:03
回答 1查看 169关注 0票数 1

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

如果我像这样用javascript做内联,它就能工作:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<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函数。我假设它是这样的:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$(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合二为一吗?

谢谢

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2010-09-26 10:26:11

您可以像这样简化PHP:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<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中执行类似以下操作

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
$(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并恢复它。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/3797363

复制
相关文章
PHP-数组翻转
数组翻转 2、数组翻转 $stu=['tom','berry','ketty','rose','jake']; for($i=0,$j=count($stu)-1;$i<$j;$i++,$j--){ [$stu[$i],$stu[$j]]=[$stu[$j],$stu[$i]]; //元素交换 } print_r($stu); //Array ( [0] => jake [1] => rose [2] => ketty [3] => berry [4] => tom )
cwl_java
2020/03/26
1.9K0
php jquery教程下载,jquery 怎么下载
下载jquery的方法:首先使用百度搜索“jQuery”;然后点击进入jQuery网站;最后找到适合开发的版本后进行下载即可。
全栈程序员站长
2022/08/22
9.4K0
php jquery教程下载,jquery 怎么下载
PHP版的jQuery
个人认为,对于Web前端程序员和跟HTML和CSS打交道的人来说,jQuery是有史以来最伟大的发明。jQuery的出现使Web程序员的开发效率突飞猛进,不亚于工业革命给人类生产力带来的提升。 但问题在在于,只有前端程序员可以利用jQuery的强力,他们可以用它分析HTML,根据CCS类,HTML属性,CSS规则等各种选择器来查 询、获取、操作HTML里的任何一个元素。而作为后端(服务端)程序员来说,他们同样需要分析HTML内容,从HTML中提取符合要求的HTML片段、获 取某个符合条件的属性值等。 遇到这
wangxl
2018/03/08
1.3K0
PHP使用DES进行加密和解密
DES是一种标准的数据加密算法,关于这个算法的详细介绍可以参考wiki和百度百科:
大江小浪
2018/07/25
2K1
使用 PHP 函数对变量进行比较
使用 PHP 函数对变量 $x 进行比较 表达式 gettype() empty() is_null() isset() boolean : if($x) $x = ""; string TRUE FALSE TRUE FALSE $x = null; NULL TRUE TRUE FALSE FALSE var $x; NULL TRUE TRUE FALSE FALSE $x is undefined NULL TRUE TRUE FALSE FALSE $x = array(); array TRUE
Denis
2023/04/15
1.3K0
PHP怎样使用JWT进行授权验证?
JWT可以取代以往的基于 COOKIE/SESSION 的鉴权体系,是目前最热门跨域鉴权的解决方案,接下来从 JWT 的原理,到 PHP 示例代码,简单说明业务怎样使用 JWT 进行授权验证。
极客开发者
2022/01/18
3.3K0
PHP使用DES进行加密和解密
DES是一种标准的数据加密算法,关于这个算法的详细介绍可以参考wiki和百度百科: wiki百科 百度百科 php中有一个扩展可以支持DES的加密算法,是:extension=php_mcrypt.dll 在配置文件中将这个扩展打开还不能够在windows环境下使用 需要将PHP文件夹下的 libmcrypt.dll 拷贝到系统的 system32 目录下,这是通过phpinfo可以查看到mcrypt表示这个模块可以正常试用了。  下面是PHP中使用DES加密解密的一个例子: 1 //$input - s
joshua317
2018/04/16
1.2K0
使用patchwork进行拼图的一些细节
说到拼图,那必须得好好学习patchwork包,这个包是Thomas大佬的作品,一经推出就火了,迅速取代了R中其他的拼图包。
医学和生信笔记
2022/11/15
5.1K0
使用patchwork进行拼图的一些细节
iOS动画-定时对UIView进行翻转和抖动
(翻转)方式一: [NSTimer scheduledTimerWithTimeInterval:3.f repeats:YES block:^(NSTimer * _Nonnull timer) { CABasicAnimation* rotationAnimation = [CABasicAnimation animation];; rotationAnimation = [CABasicAnimation animationWithKeyPath:@"t
czjwarrior
2018/05/28
1.3K0
Jquery和PHP Ajax JSON
本文由来源 21aspnet,由 javajgs_com 整理编辑,其版权均为 21aspnet 所有,文章内容系作者个人观点,不代表 Java架构师必看 对观点赞同或支持。如需转载,请注明文章来源。
Java架构师必看
2021/03/22
1.5K0
PHP 使用do{}while()进行byte单位转换
函数源码: /** byte字节单位转换函数 * @param int $byte * @return string */ function byte(int $byte){ $suffixes=["YB","ZB","EB","PB","TB","GB","MB","KB"]; do{ $byte=round($byte/1024,2); $suffix=array_pop($suffixes); }while($byte>=1024&&!em
lascyb
2021/11/04
7030
[PHP] 使用PHP在mongodb中进行count查询
在php7的mongodb扩展中,当要查询某个集合在某个条件下的数据个数时,可以使用下面的方式来获取。
唯一Chat
2020/03/19
2.1K0
treetable php,jQuery树型表格插件jQuery treetable
插件描述:jQuery-treetable是一个jQuery插件。有了这个插件,你可以在一个HTML表格中显示树,即目录结构或嵌套列表。它使你的HTML文件干净的,展现出树状表格插件,你只需要每一行数据添加特定的数据属性。
全栈程序员站长
2022/08/18
1.9K0
treetable php,jQuery树型表格插件jQuery treetable
[PHP] 使用PHP在mongodb中进行嵌套查询
作为文档数据库,数据库中存储的数据是类似json的结构,比如{“modelInfo”:{"status":1,audited:"1"}},想要查询status是1的audited是1的,需要按照下面的结构
唯一Chat
2020/03/19
1.9K0
jquery实用的一些方法
当你想实现最基本的加减法的时候,对于转换number实用Number(str)即可
陈灬大灬海
2018/09/12
3710
jquery实用的一些方法
一些好用的jquery技巧
1、返回顶部按钮 通过使用jQuery中的animate 和scrollTop 方法,不用插件就可以创建一个滚动到顶部的简单动画: // Back to top $('.top').click(function (e) { e.preventDefault(); $('html, body').animate({scrollTop: 0}, 800); }); <!-- Create an anchor tag --> <a class="top" href="#">Back to top</a> 改
前朝楚水
2018/04/02
3.9K0
使用jQuery
jQuery概述 Write Less Do More(用更少的代码来完成更多的工作) 使用CSS选择器来查找元素(更简单更方便) 使用jQuery方法来操作元素(解决浏览器兼容性问题、应用于所有元素并施加多个方法) 引入jQuery 下载jQuery的开发版和压缩版 从CDN加载jQuery <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script> <script> window.jQuery ||
用户8442333
2021/05/20
9980
opencv: cv2.flip 图像翻转 进行 数据增强
Flipped Horizontally & Vertically 水平垂直翻转:
JNingWei
2018/09/27
6.4K0
opencv: cv2.flip 图像翻转 进行 数据增强
[UWP]使用CompositionAPI的翻转动画
在 使用GetAlphaMask和ContainerVisual制作长阴影(Long Shadow) 这篇文章里我介绍了一个包含长阴影的番茄钟,这个番茄钟在状态切换时用到了翻转动画,效果如上所示,还用到了弹簧动画,可以看到翻转后有点回弹。本来打算自己这个动画效果写的,但火火已经写好了这个FlipSide控件,Github地址在这里,这篇文章就介绍下这个控件的部分原理。
dino.c
2019/11/14
7580
点击加载更多

相似问题

使用JQuery问题进行图像翻转

10

如何使用png和jquery进行翻转?

13

使用CSS和应用jQuery进行导航翻转

14

使用php改变jQuery移动翻转开关的值

26

使用jQuery翻转图像

21
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文