感觉小众已经成了专门解决疑难杂症的专业论坛了。
向各位请教一下,工作需要,点击一个包含图片的页面,该图片会呈现在一个单独跳出的标签页中,有什么尽量简单的办法能旋转这个跳出来的标签页中的图片?
目前仅仅已知,可以使用ctrl+滚轮来放大缩小。
感谢解答!
控制台运行element.style.transform="rotate(-90deg)"
firefox中可以在选定的元素上右键-在选定的元素上使用
抱歉不会写书签小工具 这个也是现查的
可以在元素属性里直接编辑 添加
style="transform: rotate(-90deg);"
如下图
感谢回复,不过真正要旋转图片的是我部门员工,一堆大妈,我不能让她们进行这种“高级”操作,她们会杀了我的。
希望能有更加简单的办法实现。
再次向您表示感谢。
提供一个Quicker动作供参考:
这个动作是模拟点击右键菜单复制图片,然后读取剪贴板中的图片显示出来。这个图片窗口是可以进行旋转的。
如果所有的图片旋转的是固定的角度,也可以在动作中通过图片处理的步骤自动旋转以后再显示。
另外也可以通过Quicker的浏览器扩展来运行脚本操作网页。
我觉得这个扩展可以啊:
右键图片,选择 Rotate 就能旋转了。
写了一个小书签,把以下代码当做网址,保存为书签栏的书签,然后点击一下旋转90度,只针对在新标签页中打开的图片设计。
javascript:(function(){/* rotate_IMG.2021.09.14 */if(!document.body.querySelector("style#rotate_img")){const a=document.createElement("style");a.id="rotate_img",a.innerHTML=`img[data-deg="90"] {transform: rotate(90deg);}img[data-deg="180"] {transform: rotate(180deg);}img[data-deg="270"] {transform: rotate(270deg);}`,document.body.appendChild(a)}const img=document.body.querySelector("img");!img.dataset.deg||360<=+img.dataset.deg?img.dataset.deg=90:img.dataset.deg=+img.dataset.deg+90;})()
2021.09.15 20:06
以此为案例写了一篇实战记录( JS 脚本实战案例 0001 - #2,来自 ejmoog ),同时搞了一份更加简单的代码(附在底下),反正两个代码都能用,达到的效果都一样,如果你看到了这里就用下面的代码,如果已经在使用上面的代码了,也没有必要特别更新。
javascript:(function(){ const oldDeg = +document.body.querySelector('img').dataset.deg; const newDeg = ((oldDeg ? oldDeg : 0) + 90)%25360;document.body.querySelector('img').style.transform = 'rotate('+newDeg+'deg)';document.body.querySelector('img').dataset.deg = newDeg;})()
在这个页面直接用的话 就看见左上角的logo在转
针对这个情况书写的,只对页面中第1个图片有效
是element的指向,element是页面元素的意思,想旋转哪个图片这里element应该是那个图片元素
Chrome系浏览器不都有“在新标签页打开图片”吗,结合楼上的方法应该就够了吧
如果使用的是vivaldi浏览器,事情会简单许多。
在vivaldi浏览器的状态栏,有个页面行为按钮,里面就有页面旋转【不过默认是旋转45度,不知道这是什么设定,需要改成90度】。
修改安装文件夹下(大致路径参考:C:\Users\Administrator\AppData\Local\Vivaldi\Application\4.1.2369.21\resources\vivaldi\user_files)
有个 Skewed_Images.js 文件,用记事本打开,把45度改成90度就好了。
实际使用时如下:
这个办法好,我用了一下,很顺利,也比较方便。我可以给几位大姐的浏览器设置好,以后她们点一下按钮就可以旋转图片了。
同时感谢以上所有帮我想办法的大佬们,感谢你们!谢谢!!
我这里就一张图片(营业执照),正合我意啊!
就是根据你的需求定制的脚本呀
这个脚本只旋转页面中第一个图片