有没有办法根据屏幕大小自动调整MediaWiki图像的大小?

时间:2012-01-31 10:41:58

标签: image mediawiki resize image-resizing

可以使用简单格式将MediaWiki pictures设置为特定大小。

但是,tables会根据浏览器/屏幕尺寸动态调整大小。

可以使图像像表一样调整大小吗?

(图片里面表不起作用!)

5 个答案:

答案 0 :(得分:5)

我有同样的问题,从上面的答案(现在他们在下面)看到你不能有几个不同相对大小的照片。所以我写了一个mediawiki扩展,允许这样:http://mediawiki.org/wiki/Extension:AdaptiveThumb

答案 1 :(得分:3)

在调整浏览器大小时动态调整大小: 将下一行放在css文件的开头:。\ skins \ common \ shared.css

img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ }

每张可调整大小的图片都会放在<div></div>

<div>[[Image:MyImage.png]]</div>

在此处阅读更多内容:http://www.mediawiki.org/wiki/Help_talk:Images

答案 2 :(得分:2)

您可以设置CSS hack。

Mediawiki允许您包含一些变量,例如alt-text,包括在该变量中,w100resizeable等特殊字符串将允许您使用CSS定位元素:

img[alt=~w100] { width: 100% !important; height: auto !important; }

请注意,由于您正在使用alt来表示它并不意味着在CSS中使用!important(因为MW将大小设置为元素样式),因此应避免使用尽可能地用作最后的手段。

答案 3 :(得分:1)

简而言之,不,没有简单的方法可以做到这一点。可以想象,可以使用一堆繁琐的Javascript来完成它,但我不知道有没有人尝试过这个并且实现不会是微不足道的。

答案 4 :(得分:0)

简短的回答是否定的。答案很长,你必须编写可以确定用户屏幕分辨率并将其存储在cookie中的JavaScript。这种情况最有可能在common.js中完成,因此除了十亿用户之外从来没有去过网站并设法直接导航到具有动态大小的图像的页面(我希望你不会在你的主页上放置类似的东西),当他们到达时,这些信息已经存在页。然后,该页面可以使用这些变量将大小设置为{{#expr:(File height * % of screen you want it to take)*(screen height)}}x{{#expr:(File width * % of screen you want it to take)*(screen width)}}px。我的wiki的主持人表示他正在编写一个新的扩展程序,可以将其作为我想要的<div style="overflow-x: scroll; width: {{#expr:(File width * % of screen you want it to take)*(screen width)}}px;">部分请求的一部分。如果您在我之前找到其他内容,请更新此帖子以便我看到它。谢谢。 :d