个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我已经给出了 2 个 div，当鼠标悬停在它上面时，它们会从屏幕右侧滑出。一个 div 包含一个图像，另一个包含一些标签和文本框。我将两个 div 都推向右侧，以便只有来 self 的图像的反馈字母可见。我的问题是，当在不同的显示器中查看网站时，div 不在我之前放置它们的位置。它只是在不同的显示器中随机移动。请帮忙。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>
</head>
<body style="overflow-y: hidden">
<div id="slideout">![my outer div][1]
<img src="images/feedback_R.png" height="500px" width="800px" alt="Feedback" >
<div id="slideout_inner">
My Content goes here..
</div>
</div>
</body>
</html>
这是我使用的 CSS 样式。
<style>
#slideout {
position: fixed;
top: 50px;
left: 1300px;
z-index: 5000;
-webkit-transition-duration: 0.9s;
-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
transition-duration: 0.9s;
}
#slideout_inner {
position: fixed;
top: 180px;
z-index: 9999 ;
left: 1400px;
-webkit-transition-duration: 0.9s;
-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
transition-duration: 0.9s;
text-align: center;
cursor: pointer;
}
#slideout_inner textarea {
width: 190px;
height: 100px;
margin-bottom: 6px;
}
#slideout:hover {
left: 800px;
}
#slideout:hover #slideout_inner {
left: 900px;
}
</style>
最佳答案
使用 px 你不能将这些图像固定到所有屏幕尺寸，除非你使用媒体查询或者你可以使用 0 px onload 制作图像，悬停时你可以像这样增加到 800px:例如:使用这种风格
#slideout {
position: fixed;
top: 50px;
z-index: 5000;
right: 0px;
-webkit-transition-duration: 0.9s;
-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
transition-duration: 0.9s;
}
#slideout:hover img{
width: 100%;
}
img{
width: 0px;
float: right;
-webkit-transition-duration: 0.9s;
-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
transition-duration: 0.9s;
}
此样式在所有屏幕尺寸下悬停时将图像宽度增加到 100%，如果您对此满意，也可将其应用于反馈内容
关于css - 如何阻止我的 Feedback Div 停止改变屏幕分辨率的位置？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/20042150/
25
4
0
我正在制作一个 php 表单，我使用 ajax 将其插入到 mysql 表中。显然，我有一个问题。 这是我的 JS，唯一不起作用的是 done 函数，它从不考虑“msg”部分，它总是显示“失败”。 $
我编写了一个具有一个条件的方法的测试。根据条件，它应该为空，并且返回空响应，但存在断言错误。 @Test public void testExtractData_feedbackRecords_wit
问题: 我正在实现一个表单并且很难理解为什么 React Bootstrap:验证为假时不显示 重现步骤: 当用户点击 Send Verification Code按钮，type={'submit'}
Closed. This question is opinion-based。它当前不接受答案。 想要改善这个问题吗？更新问题，以便editing this post用事实和引用来回答。 已关闭6年。
我的表单流对话框包含一个应用了自定义验证的字段... var form = builder .Field(new FieldReflector(nameof(UserName)) .
就目前而言，这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持，但这个问题可能会引起辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开，visit the he
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题，以便用事实和引用来回答。 关闭 3 年前。
“Android 设计”网站推荐可 ScrollView 的“边界反馈”。 http://developer.android.com/design/style/touch-feedback.html
我正在寻找一个 .jar 或库项目，它可以让我的应用程序的用户轻松地从应用程序内部发送关于他们体验的反馈。 如 this question 中所问，我正在寻找类似于 Google Plus 中使用的崩
我想在 ID 为“messagefield”的范围内显示 5 条用户反馈消息。 我希望跨度彼此堆叠，最新的位于顶部 当 5 个 Span 堆积起来时，我想删除它们 --> 替换它们包含以下 5 条消息
我最近偶然发现了一些非常酷的 js，它可以呈现带有突出显示区域的屏幕截图，以便在您的网站上提供反馈。该程序的网站可以在这里找到:http://experiments.hertzen.com/jsfee
我目前正在开发我的第一个 jQuery 插件。它称为 Fraction Slider，是一个幻灯片放映框架，允许您为每张幻灯片设置无限元素(使用不同的动画、延迟等)。 在这里你可以找到一个小演示，还有
我正在专门查看“可选”演示。以下是供引用的示例代码: #feedback { font-size: 1.4em; } #selectable .ui-selecting { backgrou
我已经给出了 2 个 div，当鼠标悬停在它上面时，它们会从屏幕右侧滑出。一个 div 包含一个图像，另一个包含一些标签和文本框。我将两个 div 都推向右侧，以便只有来 self 的图像的反馈字母可
如何以编程方式更改“触觉反馈”等全局设置？ (您可以在“声音和显示设置”中手动更改此设置) 改变例如飞行模式可以使用以下代码完成: private void setAirplaneMode(boole
feedback.js是一个很棒的 jquery 插件，它允许您创建反馈表单，其中包括在客户端浏览器上创建的屏幕截图以及表单。 如何将捕获的图像和用户的评论发送到服务器端 api？ 最佳答案 的确，f
使用 wicket 制作表格以产生一些积极的反馈信息的最佳做法是什么？ 示例:我有一个表单，用户可以在其中请求更改忘记密码的链接。用户将此链接发送到他给定的电子邮件地址(像往常一样)。 如果用户在表单
今天刚刚启动 Xampp，当我打开我的 SQL 时，它只是再次关闭并告诉我 MySQL 意外关闭。 这是日志: 2020-09-22 9:28:33 0 [Note] InnoDB: Mutexes
我正在尝试使用 has-feedback 表单类在表单字段上添加图标，但是在输入字段大小调整时，图标显示超出范围，下面是问题的 jsfiddle: jsfiddle
此处 Maps 提供了 Maps Feedback API，即提交有关其 map 上缺失地点的信息。 我创建了一个项目并成功生成了用于 Places API 的 API key 。接下来，我尝试将它与
我是一名优秀的程序员,十分优秀！