问题标签 [responsive]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
223 浏览

html - 内联导航栏通过字体按钮压缩为下拉块导航

我正在为我的一位艺术家朋友 (kouroshesfandiari.com) 创建一个网站,但在响应式导航方面遇到了问题。在横向模式的台式机和平板电脑上,我想要水平(内联)导航,而对于纵向模式(直立)的手机,我希望三行按钮图标在悬停或点击时显示块式导航。

我使用 icomoon 的应用程序为三行图标安装了一个小字体文件,并使用orientation:portrait 媒体查询允许我为手机提供不同的功能。但是,似乎无论我在导航 CSS 或其纵向媒体查询中进行什么更改,都不需要该功能。

如果我让它在手机上看起来像我想要的那样,导航仍然是平板电脑和台式机尺寸的一块。如果我获得了内联导航并以我想要的方式显示在平板电脑和台式机上,它会为手机视图抛出一切。更好的方法将不胜感激。现在似乎有很多网站使用这种类型的响应式导航,但我找不到描述如何做到这一点的资源。

的HTML:

和CSS:

0 投票
1 回答
195 浏览

php - 移动设备上的 PHP 网站

我有一个 Google App Engine PHP 网站,一切正常。但很明显,当它加载到移动设备上时,它就像普通网页一样加载。将网页“转换”为在移动设备上加载时看起来更好的最佳方法是什么?通过 CSS?

0 投票
1 回答
69 浏览

php - 响应式表和 mysql

首先,我必须说我是 Web 开发的完整新手(工作 2 个月)。所以请原谅我任何“愚蠢”的评论或问题。

我有一个表,其中包含存储在 MySQL 数据库中的日期。我使用表单将这些数据发送到表中。

我的问题是:

“我可以在表格的每个 ID 上创建一个超链接,这样当我点击它时,它会在同一页面上显示记录的数据吗?”

我所能做的就是在另一个页面中显示表格。

0 投票
0 回答
96 浏览

html - 使用表格布局的响应式表格

我一直在试图弄清楚为什么我的表格在 600 像素时无法正确显示在我的屏幕上。我在codepen上试过了,它工作正常,一定有什么东西阻止它在小屏幕上正确渲染。

演示

这是我在 600 像素的网络浏览器上得到的。

在此处输入图像描述

0 投票
1 回答
77 浏览

ios - Foundation - 5 个 iPhone 6 网站以桌面版本显示

我正在使用 Foundation 5 构建网站,但是当在 iPhone 6 或 6+ 上查看时,它会显示桌面版本,这很容易理解。

但是,坚持使用移动视图的最佳方式/最佳实践是什么,就好像它是用于(iPhone 4 或 5)一样?

0 投票
1 回答
2718 浏览

layout - Full height layout with Header, footer, sidebar and content divided into 4 equal boxes

I am trying to do the layout that can be seen in the image below: Wide screen layout

It is full screen, the header and footer have fixed height (60px), the green sidebar is 200px wide; both the sidebar and the section on the right side occupy the entire available space on the y axis.

For wide screens, I want to divide the right side into 4 equal boxes, displayed 2 by 2.

For medium and small screens (< 768px), I want to display the 4 equal boxes 1 by 4, like the image below:

enter image description here

The HTML I have:

The CSS I have:

How do I style those red boxes to achieve the 2 layouts, if possible, without using display:table and display:table-cell, as this will create problems with positioning items absolutely inside the red boxes on Firefox?

Thank you!

0 投票
2 回答
190 浏览

css - 调整大小时容器 DIV 会拉伸,但滚动时不会

我有一个主<div>屏幕以屏幕为中心,高度是视口高度的总大小。当我调整浏览器的大小时它工作正常,但如果我在可见浏览器窗口下方有内容并且需要向下滚动,则<div>变为静态并假定它滚动时的大小。此处需要更改什么以便容器<div>在滚动时正确调整大小?

0 投票
2 回答
79 浏览

html - xs screen时bootstrap不同的列聚在一起

我有五个不同的列:

所有内容都有width: 100%,所以大小没有预期的那么大padding: 0px

当屏幕为 XS(小型设备)时,其中一列(“疫苗/芯片”)位于另一列下方,而不是传递到破坏结构的下一行。

以下图片可提供帮助:

大屏幕(lg)

手机屏幕 (xs)

编码:

0 投票
1 回答
93 浏览

android - 我是否应该专注于我的第一个 Android APP 的响应性或功能性

我正在开发一个 Android 应用程序,但我不确定我的工作流程应该如何。

我是否应该专注于功能,我的意思是,只有一种屏幕尺寸的设备,然后将应用程序调整到其他屏幕尺寸。

还是我应该在处理功能的同时关注响应性?

0 投票
1 回答
103 浏览

javascript - function suddenly stopped working after a simple change

Hello good people from stackoverflow.

I got a question.

I recently added a responsive menu to my website. It worked fine. But I added a second, different menu. One made for mobiles. I hide it on a normal scale and show it at the mobile version. But the function suddenly stopped working. No names were changed except for one but that should not interfere with it. Here is the old code:

And here is the new code:

And last here is the function:

}

It is all linked properly because it worked before. I hope anyone can help me with this.

Thanks in advance.

EDIT: Here is the link to the website, just scaled it to mobile to see it: http://portfoliotristan.esy.es/index.php