Javascript/Css matrix3d onscroll函数在旋转时缩小元素
JavaScript/CSS的matrix3d和onscroll函数在旋转时缩小元素的效果是通过CSS3的transform属性实现的。matrix3d函数是一种矩阵变换函数，可以在3D空间中对元素进行旋转、缩放、平移等操作。onscroll函数是JavaScript中的一个事件处理函数，用于监听滚动事件。
当使用matrix3d函数对元素进行旋转时，可以通过设置scaleX、scaleY和scaleZ属性来实现元素的缩小效果。这些属性控制元素在各个轴上的缩放比例，当缩放比例小于1时，元素就会缩小。
下面是一个示例代码，演示了如何使用matrix3d和onscroll函数在旋转时缩小元素：
<!DOCTYPE html>
<html>
<head>
<style>
.box {
width: 200px;
height: 200px;
background-color: red;
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transition: transform 0.5s;
}
</style>
</head>
<body>
<div class="box"></div>
<script>
window.onscroll = function() {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
var scale = 1 - scrollTop / 1000; // 根据滚动距离计算缩放比例
var transformValue = 'matrix3d(' + scale + ', 0, 0, 0, 0, ' + scale + ', 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)';
document.querySelector('.box').style.transform = transformValue;
};
</script>
</body>
</html>在上述代码中，通过设置transform属性的matrix3d值来实现元素的旋转和缩放效果。onscroll函数监听滚动事件，根据滚动距离计算缩放比例，并将缩放比例应用到元素的transform属性上，从而实现元素在旋转时的缩小效果。
推荐的腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
- 腾讯云音视频处理（MPS）：https://cloud.tencent.com/product/mps
- 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
- 腾讯云物联网（IoT）：https://cloud.tencent.com/product/iotexplorer
- 腾讯云移动开发（MSS）：https://cloud.tencent.com/product/mss
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云元宇宙（Metaverse）：https://cloud.tencent.com/product/metaverse
请注意，以上链接仅供参考，具体产品选择应根据实际需求进行评估和决策。
相关·内容
是否可以通过使用*或类似的classList来触发JavaScript css元素？
在我的CSS中，我写了以下文章来禁用所有 CSS动画：
* {
transition: none !important;
transition-property: none !important;
transform: none !important;
animation: none !important;
}
这很好，但我想通过JavaScript触发它，这样我就可以启用或禁用动画。
我做了以下工作：
*.animationsDisabled {
transitio
浏览 2提问于2016-10-21得票数 1
回答已采纳
1回答
我在Edge (和IE11)处理matrix3d转换的方式上遇到了一个奇怪的问题。我正在处理的页面的元素已经应用了任意的变换(由于使用了一个插件)，但是多亏了我的经理，我现在需要在此基础上绕Y轴旋转180度。因此，我不能简单地使用rotateY()函数，因为它替换了旧的转换并移动了元素，所以我认为我需要使用矩阵。这在Chrome和火狐上运行得很好，但Edge似乎不能以同样的方式处理matrix3d。
下面是一个使用rotateY的示例：
(HTML)
<body>
<div class="flip-container">
<div
浏览 0提问于2016-03-29得票数 0
1回答
我正在尝试使用CSS3 rotateY旋转图像。我需要用jQuery得到旋转的角度。
我的问题是了解图像旋转了多少个周期。
示例：
180 degrees: matrix3d(-1, 0, -0.00000000000000012246467991473532, 0, 0, 1, 0, 0, 0.00000000000000012246467991473532, 0, -1, 0, 0, 0, 0, 1)
360 degrees: matrix3d(1, 0, 0.00000000000000024492935982947064, 0, 0, 1, 0, 0, -0.000000000000
浏览 0提问于2013-05-04得票数 2
1回答
使用map3d时，默认标记创建始终垂直于视口。如何创建一个在地图上平铺的标记？我不能使用GroundOverlay，因为当地图缩小时，它变得太小了。我如何创建一个matrix3d对象，它将旋转/缩放/倾斜我的标记的前景DisplayObject，使它在透视模式下与地图保持平坦？
谢谢，安德鲁
浏览 0提问于2009-10-05得票数 0
回答已采纳
2回答
我正在为一个网站创建一个导航栏，但是我似乎不能让它工作。我希望当你在网站上向下滚动时，徽标会缩小。我尝试过webkit动画和一些javascript/jQuery函数，但他们不想合作。这是我目前使用的函数，它似乎不喜欢它。我该如何修复它？
HTML：
<html>
<body>
<script>
$(document).on("scroll", function() {
if($(document).scrollTop() >= 1)
{
浏览 0提问于2016-05-29得票数 1
1回答
CSS指数
、、、
我的javascript代码适用于双倍，当我将数组转换为string时，我得到了以下结果：transform: matrix3d(1, 0, 0, 0, 0, -1, 1.2246468525851679e-16, 0, 0, -1.2246468525851679e-16, -1, 0, 0, -1.224646841997256e-14, -100, 1);
这在css中不起作用，因为1.224646841997256e-14在CSS中无效。
var toStr = function (a) {
return 'matrix3d(' + a[0] + ',
浏览 14提问于2014-04-10得票数 2
回答已采纳
2回答
对不起，伙计们，我对Javascript很陌生。在这里发布之前，我已经搜索过类似的解决方案。
我想改变背景颜色，每次多个div标签，具有特定的I，来150像素之前，他们到达浏览器顶部。我希望它能在不同的设备中正常工作。我在javascript中尝试了不同的东西，但是没有一个给出我想要的响应能力。当我缩小浏览器的宽度时，文本就会折叠，div/id的位置也会发生变化。所以我的逻辑是..。例如，如果一个带有id="One“的div从上到下是150 is，则更改背景颜色。
var one = document.getElementById("one");
var two =
浏览 1提问于2020-08-11得票数 0
回答已采纳
1回答
首先，我根本不是一个数学专家。请宽容我的数学错误，必要时纠正我，我很乐意学习。
我有一个立方体，它使用带有transform的css动画旋转: matrix3d(4x4)。我还可以手动旋转多维数据集，将用户操作转换为相同的matrix3d转换。
当用户停止交互时，我想要的是一个带有css的旋转立方体，从用户离开它的位置开始。通过获取多维数据集的转换matrix3d值并使用乘法动态设置css的关键帧，我正在成功地完成这一任务。
然而，当用户开始与多维数据集交互时，多维数据集跳转到最后一个已知的手动旋转点，并从那里继续，因为我不知道如何从4x4矩阵中获得X和Y轴上的旋转。
我目前正在使用下面的库，
浏览 0提问于2019-07-05得票数 4
回答已采纳
我想在bootstrap的导航菜单上创建一个scrollspy效果，页面顶部有一个旋转木马，导航菜单在旋转木马的底部。因此，当有人向下滚动时，在他通过导航菜单后，导航菜单将具有navbar-fixed top类，查看者将看到该菜单。我今天解决了这个问题，但我找不到解决这个问题的方法。下面是我的HTML代码：
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 101 Template</title>
<meta name="viewport" cont
浏览 0提问于2013-12-21得票数 0
3回答
我看到了关于sizeof()结果的这个问题，我不理解这个函数的输出。
#include <stdio.h>
void checkSizes(char matrix3d[10][20][30])
{
printf ("%lu\t", sizeof(matrix3d));
printf ("%lu\t", sizeof(*matrix3d));
printf ("%lu\t", sizeof(**matrix3d));
printf ("%lu\t", sizeof(***matrix3d)
浏览 6提问于2016-09-01得票数 8
回答已采纳
3回答
我想知道如何才能达到这个wordpress主题中的效果：
我想找出如何隐藏顶部图像div与内容时向下滚动。我不确定这是javascript还是CSS的魔术，如果你们有任何意见，我将不胜感激。
干杯，赫斯托。
浏览 2提问于2014-02-18得票数 0
2回答
我的add类没有更新吗？我正在尝试做一个粘性的导航，但是我的网站没有更新css。现有的问题似乎都无济于事。该网站为
Html：
<nav id = 'main-nav'>
<a href="/index.php"><img class = 'logo' src='CSS/IMG/logo.png' alt='Logo'></a>
<ul>
<li><
浏览 0提问于2018-11-28得票数 1
我们有一些ASP.net页面，其中包含超过50+行的特定于该页面的javascript。我们希望在CruiseControl构建过程中缩小该javascript。
我们已经使用YUI Compressor来压缩完整的javascript和css文件。但是我们不知道如何做内联javascript。
有没有一个MSBuild任务可以旋转asp.net页面并缩小javascript？
浏览 1提问于2009-12-23得票数 7
回答已采纳
我需要你的支持，因为我写了这段代码来创建一个按钮，当我按下它时，我移动到页面的顶部，...the按钮很好地创建，并移动到页面的顶部。但是我希望按钮在页面顶部滚动时隐藏，当我向下滚动...the滚动功能时再次出现，我不知道为什么…。我支持JavaScript和CSS中与我的问题…相关的代码。如果你能修好它，你就是天才。
第一JavaScript码
//here i create a function to make scroll smooth...i can write it in css file but i want to show what is i lrarned:
const scro
浏览 1提问于2022-05-23得票数 0
我想在滚动上旋转一个div。
当我向下滚动页面的25%时，我希望元素旋转90*，当我滚动页面的50%时，我希望它旋转180*，以此类推。
有人建议我使用jQueryRotat.js，我在JSfiddle上填写了所有的信息，但是我不能让它工作。你可以在这里查看我已经有的东西：
这就是我到目前为止所得到的
HTML：
<div class="site_wrapper">
<div class="logo">
<h1>Logo</h1>
</div>
</div
CSS：
浏览 1提问于2013-09-30得票数 1
我在使用火狐CSS3转换时遇到了一些奇怪的行为。
我的问题在这个JSfiddle中得到了说明：
基本上，rotate3d变换函数将旋转轴作为前三个参数，将角度作为最后一个参数。只处理XY平面(我还没有在Z维度上测试这一点)，似乎只有当x&y坐标都是正的或者都是负的时候，firefox才会像预期的那样旋转。
作品：
-moz-transform: rotate3d(1, 1, 0, 180deg);
不工作(显示与^相同)：
-moz-transform: rotate3d(1, -1, 0, 180deg);
我似乎无法破译是什么导致了这种情况，或者是否有任何变通方法可以绕着象限II或
浏览 1提问于2013-01-27得票数 2
回答已采纳
我一直在探索如何在CSS中使用perspective来创建一个多维数据集，希望最终我能将它动画化。
目前，每个面上的每个单独的正方形都是绝对定位的CSS3D转换，但我想知道的是，是否有可能通过使用transform: matrix3d()减少我编写的代码量
我找不到对我来说有意义的关于transform: matrix3d()的解释，所以我不知道如何使用它，或者它是否是我想要的。
这是我到目前为止所得到的一个 -不幸的是，它目前是静态的，所以它不会旋转，但是有6个边。
浏览 0提问于2015-06-30得票数 0
回答已采纳
很长一段时间后，我再次尝试使用JAVA。我使用的是向量数学软件包，我想用它旋转一个带有旋转矩阵的三维矢量。所以我写到：
double x=2, y=0.12;
Matrix3d rotMat = new Matrix3d(1,0,0, 0,1,0, 0,0,1); //identity matrix
rotMat.rotX(x); //rotation on X axis
rotMat.rotY(y); // rotation on Y axis
System.out.println("rot :\n" + rotMat); // diagonal
浏览 7提问于2015-08-05得票数 0
回答已采纳
在我的html文档中，有一些带有两幅图片(一张jpg作为背景，一张png作为前景)并具有悬停效果的瓷砖:在您正在悬停的当前瓷砖上，图像在鼠标所在的位置被放大，而前面的图像被移离光标。
当光标只水平移动的时候，所有的垂直图片都是动画的，相反的。
下面是一个包含所有html、javascript和css的示例：
效果是有效的(有几个bug，但这并不重要)。
动画很容易用javascript和transform3d添加，其中item是类.item的当前平铺。像topRatioFron这样的变量是从当前鼠标相对于当前瓷砖的位置计算出来的。
item.find('.front').cs
浏览 4提问于2015-08-04得票数 1
回答已采纳
1回答
我的目标是增加复选框的大小，跨浏览器。我在Internet Explorer、Firefox和Chrome中通过使用浏览器前缀(-moz-、-ms-等)实现了这一目标。有了这个：
input[type=checkbox]
{
/* Double-sized Checkboxes */
-ms-transform: scale(2.1, 2.1); /* IE */
-moz-transform: scale(2.1, 2.1); /* FF */
-webkit-transform: scale(2.1, 2.1); /* Safari and Chrome */
-o-t
浏览 1提问于2014-04-26得票数 0
11回答
webkit去年在上的博客文章解释了可以在-webkit-transform属性中使用的各种转换‘函数’。例如：
#myDiv {
-webkit-transform: scale(1.1) rotateY(7deg) translateZ(-1px);
}
我的问题是:如何访问JavaScript中的各个值？当您读取元素的webkitTransform属性时，您只会得到一个包含16个值的matrix3d()函数，如下所示...
matrix3d(0.958684, 0.000000, .....)
有没有一种方法可以只读取单个变换对象的值，比如rotateY()？或者我必须从matrix
浏览 0提问于2010-08-08得票数 19
3回答
当页面向下滚动到可见时，我想要一个元素来执行CSS3动画，我想知道是否有任何方法可以做到这一点。任何涉及JavaScript或CSS的东西都可以。我做了很多谷歌搜索和堆栈溢出搜索，但找不到我真正需要的东西。
浏览 4提问于2014-08-10得票数 0
回答已采纳
我之前问过适当的 (计算和组成一个矩阵)，现在我面临的是一个更老的问题，我没想到这仍然是一个问题。
基本上360 don/720 don只是零，我不知道如何破解下面的函数来解决这个问题。
CSSMatrix.Rotate = function(rx, ry, rz){
rx *= Math.PI / 180;
ry *= Math.PI / 180;
rz *= Math.PI / 180;
// minus sin() because of right-handed system
var cosx = Math.cos(rx), sinx = - Math.sin(rx);
v
浏览 5提问于2016-03-09得票数 0
回答已采纳
我有这段代码(见下面的代码)--我对Javascript感到很糟糕，我希望有人能在不使用jquery的情况下帮助完成这项工作。如果不可能使用相同的解决方案，那么只需将不同的CSS样式应用于滚动超过300 on的项。我看过，但是Javascript和JQuery对我来说是陌生的.
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).on("sc
浏览 1提问于2015-03-27得票数 2
回答已采纳
我正在开发一个WordPress站点，我使用了以下JavaScript代码来缩小滚动上的徽标：
徽标有id #logoid
CSS
.logoclass {width:100%;
transition: width 0.5s linear;}
.scroll {margin-top:-10px;
width:55%;
transition: width 0.5s linear;}
Javascript
<script type="text/javascript">
window.onscroll = () => {
const nav = documen
浏览 1提问于2018-03-22得票数 0
回答已采纳
TL/DR；title说明了一切。HTML/CSS唯一的网站没有按预期执行。 我是一个HTML/CSS的初学者，5年前只上过密歇根大学的HTML和CSS在线课程。我已经使用W3 CSS模板编写了我的小型企业页面，但在小型设备上查看时遇到了问题。我们不需要一个非常花哨的javascript网站来吸引竞争对手的客户。 我已经复制了一个网站(去掉所有个人信息)并上传到http://testurl.gq (不确定是否允许链接到网站？)我只是不想在这里发布我的整个代码。 我试着在滚动时隐藏导航栏，因为它在移动设备上占据了太多的屏幕，但没有运气-这应该很容易，对吧？我如何隐藏它，或使字体缩小，以减少考虑
浏览 12提问于2021-06-20得票数 0
2回答
创建矩阵？
、、、
我试图用Eigen::Matrix3d创建一个旋转矩阵，但似乎不能准确地完成。
void rot(double x,double y,double z)
{
Eigen::Matrix3d x_r ((double)1,(double)0,(double)0,
(double)0,cos(x),-sin(x),
(double)0,sin(x),cos(x));
Eigen::Matrix3d y_r (cos(y),(double)0,sin(y),
浏览 0提问于2016-04-24得票数 0
回答已采纳
是否可以使用JavaScript创建一个计数器，显示用户从页面顶部滚动到多远，或者从页面左侧滚动到多远？
下面是我尝试过的代码，但当我滚动时，它并不算在内。
这里是我正在使用的HTML、CSS和JavaScript，我试图在不使用jQuery的scrollTop函数的情况下解决这个问题。
HTML：
<p>
Distance from top = <span id="windowTop"></span>
<br/>
Distance from left = <span id="windowLeft&#
浏览 3提问于2013-07-25得票数 0
回答已采纳
5回答
我需要使用jquery更改元素的转换。我有一个带有css的div：
.bottom_face {
-webkit-transform: rotateX(-90deg) rotate(180deg) translateZ(487px);
-moz-transform: rotateX(-90deg) rotate(180deg) translateZ(347px);
}
当用户更改窗体上的属性时，我希望更改translateZ值以添加他们输入的数量：
$('.bottom_face ').css('-webkit-transform') ??
如何在不覆
浏览 4提问于2013-03-01得票数 4
嘿，嘿，
我不是一个开发人员，但试图为我的婚礼庆典建立一个小的私人网页，并想添加一个滚动到顶部按钮。我正在编程的网站手动使用VSC。我的问题是，我可以使用HTML和CSS生成按钮，但是JS似乎不起作用，我也不知道出了什么问题。是的，在浏览器中启用了JS。
因此，我在HTML中添加了这个按钮：
<button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
并将我的.js文件链接到HTML页面标题中。
<script type="
浏览 6提问于2022-01-15得票数 1
2回答
因为我非常确定没有原生的html或CSS方法可以做到这一点，所以我对使用JavaScript做到这一点持开放态度。显然，我可以在CSS中使用overflow: auto在div的底部获得一个滚动条。有没有一些JavaScript可以从底部“克隆”滚动条并将其放在div的顶部？也许还有别的办法？
浏览 0提问于2010-02-17得票数 34
回答已采纳
这更像是一个数学难题，而不是具体的编码，但我相信我也需要帮助。
我正在编写一些代码，将MicroStation单元格放置在选定的比例上，然后使用MicroStation命令将部分单元格拉伸到另一个位置。代码已经完成了，我想，因为它在我的测试环境中工作，但是在与一些用户的测试中，它立即崩溃了。这需要一些时间来确定原因，这是由屏幕上的视图有旋转应用造成的。
我的代码依赖于捕获使用point3d检索的单元格位置开始时的用户放置位置，然后我需要从最后一点沿XY在一个设定的距离上选择另一个点，这是通过考虑所选的比例"CellScale作为整数“来调整的，因此我的第二个位置被定义为：
PosFlo
浏览 0提问于2015-07-29得票数 0
1回答
如何将矢量转换为z旋转角
、、、
请帮帮忙。
我在3D max上的相机方向是：
90 -30 0
当我导出到X3D文件时，它将具有以下方向：
0, 0, -1, -0.524
我可以很容易地把它转换成z轴上相机的角度，像这样：
-1 * -0.524 * 180/Math.PI = 30;
问题：
但是当我最大限度地旋转相机到：
90 -30 90
在X3D上，我得到了这个向量：
-0.251, 0.935, -0.251,-1.638
怎样才能计算出z角的值？
浏览 3提问于2018-08-25得票数 0
1回答
我目前正在进行一个CMS项目，使用CSS transform属性创建透视图对象(缩放、旋转、转换.)3d: XYZ。当创建一个对象时，它的matrix3d(-16值-)中包含了window.getComputedStyle(element) -> style['transform']返回的这些特征，下一步是创建动画:通过一组input[range]，用户可以修改这些对象的特征，并在动画完成后获得它们的最终状态。效果很好。现在的问题是创建完整的动态CSS系统，一个对象一个对象。
我有它的matrix1 (初始matrix3d)和它的matrix2 (最终matrix3d)。
浏览 2提问于2022-01-20得票数 0
我正在构建一个导航栏，如果用户滚动到一个广告，它会改变它的背景颜色。之前，我使用了"window.scrollY“方法，如果它的数字超过700，就会改变颜色。不幸的是，这种方法不能响应不同的屏幕。
在我的导航栏中，当我点击一个标题时，网站会自动滚动到该部分。
我使用引用来做这件事，我想知道你是否知道一种方法来检查滚动是否到达屏幕顶部的引用(以替换不好的配色系统)。
就像ref.current.isReached一样？返回一个布尔值。有了它，我可以用更好的方式改变我的css。
我希望我说得很清楚，我的英语很差。
这是我与ref系统的类：
const Home = ({ section }
浏览 0提问于2020-03-10得票数 0
我正试图从我正在学习的“前沿发展”课程中提炼出一项练习。该项目是一个随机的彩色梯度背景发生器。
我使用DOM操作来设置颜色，通过CSS类动画按钮，等等。
不过，我对如何解决三件事有疑问：
1-我的“随机化”按钮一旦按下就会保持选中，一个可见的蓝色选择框就在它周围。因此，它不会播放悬停动画，直到用户点击出按钮。
2-我的颜色输入元素的样式在火狐和动画中不起作用。我对修复兼容性不太熟悉，所以找不到这个:/
3-用于动画的两种颜色输入，我使用classList.toggle javascript方法切换一个动画CSS类。当然，正如方法名所示，它切换类，这意味着动画只在用户单击随机化按钮时再播放一次。
浏览 1提问于2019-02-13得票数 0
这里..。
...I在右栏有一个非滚动广告。它工作的很好，但我需要更多的调整。
首先，停止滚动操作从页面顶部的绝对像素量开始。相反，我需要从前一个div下的绝对像素量开始操作，前一个div的id为"relProd“。我不知道如何在javascript中指定它。
其次，我需要图像重新开始滚动在页面底部的橙色广告上方的固定像素量。(换句话说，它需要在某个点上“刹车”，这样它才不会掩盖橙色广告。)
有谁可以帮我？我到处寻找答案。希望我能了解更多的javascript。
谢谢!
浏览 1提问于2014-04-22得票数 0
1回答
我目前在一个简单的网站上使用HTML、CSS和JavaScript，这个想法本质上是一个从页面底部开始的故事，读者在阅读时必须向上滚动到最上面。一旦他们到达页面的顶部，读者就会向下滚动，继续阅读故事。
在我的HTML main中，我为文本添加了两种类型的div类，它们应该出现在屏幕上，当读取器向上滚动时，当它们向下滚动到顶部时：
在滚动时出现：
<div class="part-1 para-one">
<pre>
PART 1 CONTENT DISPLAYS HERE
</pre>
</div>
向下滚动时出现：
<
浏览 0提问于2020-05-10得票数 2
回答已采纳
1回答
在Flash上强制底边距为负
、、、、
我有一个650像素高的.swf导航旋转木马，底部的200像素是为旋转木马的反射保留的。反射是非常微妙的，并不被认为是重要的信息，所以当窗口高度足以容纳最上面的450像素时，我们希望删除垂直滚动条，但不能删除反射。
我试图通过设置闪存<object>的margin-bottom: -200px来实现这一点，但这只会使容器的高度缩小200像素，导致背景图案在页面底部之前剪切。Flash本身仍然占用650像素。
除了使用javascript主动隐藏/显示滚动条之外，是否有一些“适当”的修复方法？
浏览 0提问于2011-08-04得票数 1
2回答
我正在使用这里描述的折叠标头
我想至少对于重置，我必须使用javascript (或者CSS复选框技巧？)。"reset“按钮是否可以完全使用CSS显示，或者我是否必须使用window.onScroll来检测内容区域的滚动并通过javascript自己显示按钮
浏览 0提问于2016-02-03得票数 2
我在css中设置了一个div的宽度为100%，它最初在纵向模式下是可以的。我将iphone旋转到横向模式，然后切换到纵向mode.unfortunately，页面呈现混乱，看起来这个div是缩小的。问题页面如下所示：
页面包含两个部分，图像区域的宽度和高度都是通过JavaScript设置的，blow图像是我之前提到的div，从横向到纵向模式旋转后似乎会缩小。我在head中放置了元标签viewport，设置为
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-sca
浏览 3提问于2015-12-21得票数 1
我正在编写一个程序，尝试在ModelVisual3D上实现几个转换。我对TranslateTransform3D没有问题，但是当我试图旋转一个对象(ModelVisual3D)时，它的CenterX、CenterY和CenterZ坐标将变为0,0,0。我不知道如何记住对象的最后一个位置，当我旋转它时，对象停留在我平移它的地方。我实现了一个对象的旋转，当双击LeftMouseButton时，但旋转是唯一执行的，once.Here是代码的和平，这对应于RotateTransform：
MyViewport.MouseMove += (sender, e) =>
{
if (model
浏览 1提问于2014-10-27得票数 2
1回答
在我的应用程序中，我使用HTML5画布来呈现一个大型的单元格矩阵(1000*1000)，这些单元格要么已经填充，要么没有填充。
但是，我未能保持第一列和第一行的固定，同时允许滚动矩阵的其余部分。以下是我想要达到的目标：
滚动可以是CSS/browser滚动条，也可以是javascript_based滚动。
对于如何保持第一行和第一列的固定有任何提示吗？
更新:当向左/右滚动时，第一行也应该滚动，向上/向下滚动和第一列相同。
浏览 1提问于2012-02-24得票数 0
2回答
下面是导航栏缩小前的css： .navbar{
display: flex;
justify-content: space-evenly;
align-items: center;
position: fixed;
width: 100%;
height: 15vh;
background-color: transparent;
z-index: 1;
transition: 0.6s ease;
} 这是我想要的在它缩小后：(在向下滚动一点之后) .navbar.adjust{
background-color
浏览 24提问于2020-12-30得票数 1
回答已采纳
1回答
以下代码已经在最新的铬、Opera Mini、Safari for IOS 7以及最后在Android2.3.3的默认web浏览器上进行了测试。
您可能已经知道，Android2.3.3不支持CSS overflow规则，这使得sidenavs不可滚动。
你猜怎么着？我找到了解决办法。请参阅下列代码：
//Import element
cont=document.getElementById("content");
nav=document.getElementsByClassName("navbar");
opt=document.getElementsByC
浏览 0提问于2019-07-31得票数 5
回答已采纳
HTML
<!DOCTYPE html>
<html>
<head>
<title>Admission</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<ul class="nav" id="topnav">
浏览 6提问于2017-02-04得票数 0
回答已采纳
我正在尝试使用webkit对CSS3 transform: matrix3d(<matrix>)的支持来创建一种“落牌”效果。(输出的唯一目标是Chrome)
最终效果应该过渡到下面的4个阶段，最终只是一条水平线：
这是我现在拥有的CSS：
#test {
margin: auto auto;
height: 200px;
width: 200px;
border:1px solid black;
background-color: lightblue
浏览 0提问于2011-02-10得票数 8
回答已采纳
1回答
我想做的是：
我希望将一个模型(很可能是.3ds)加载到我的.swf中，并能够用鼠标旋转它。
乍一看，这很好，但有问题，旋转‘切换’转过去。或者换个说法：
想象一下，我们有一个管道形状的模型。如果我们把鼠标拖动到右边，模型沿着它的X轴向左旋转，鼠标向左旋转，X轴旋转向右，鼠标向上移动，Y轴向下旋转，鼠标向下，Y轴向上旋转。
现在，让我们把管道向右或左转，直到我们面对管道的(前)‘背面’，然后我们移动鼠标向下。模型将向下旋转而不是向上旋转。
我希望你能理解我的意思。我已经四处寻找了很长一段时间，但一直没有找到一个令人满意的解决方案。有人说过四元数，但我不能理解。
我在某个地方读到的另一项建议如下
浏览 0提问于2013-09-26得票数 0
回答已采纳
1回答
我对Kinect开发相当陌生，我正在尝试构建一个组件，允许Kinect关节的旋转。这样做的目的是手动“修复”我捕获的任何骨架数据，post捕获，在那里骨架开始跳跃。
我正在使用螺旋工具包在3D空间中显示Kinect骨架。我可以在任何给定的点暂停骨架流，并查看BoneRotations对象中保存的AbsoluteRotation和HierarchicalRotation的矩阵值。
我创建了三个表示X轴，Y轴和Z轴的滑块.我已经将他们的最小/最大值设定为与骨的自然运动有关的东西，这是要被操纵的(例如在Y轴上，肩部不超过40度)。如果我们以肩关节(右)为例，我希望能够在每个轴上进行旋转，这样我就可以
浏览 7提问于2013-12-06得票数 3
回答已采纳
3回答
在我的网站上，我需要应用css的某些图片，在一个引导旋转木马。当需要旋转特定图像时，我遍历页面上的图像，并运行javascript函数applyImageRotation。在尝试应用页边距之前，我试图确保图像已完全加载到页面上：
function applyImageRotation(carousel_img, thumbnail_img, rotation, pageSource){
if(pageSource=="index"){
carousel_img.on('load', function(){
console.log(&
浏览 4提问于2014-07-19得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
