Tag: css3

单击按钮情况切换页脚

我已经研究了一个星期左右，我有一个有效但不太好的解决方案。 我有一个隐藏的页脚，上面有一个像按钮一样的标签。 单击此按钮后，我的页脚将向上滑动并同时按下该按钮。 我的问题来自于我无法将我的按钮放在页脚内。 由于页脚被隐藏直到被点击，因此该按钮也将被隐藏。 我尝试过的一种方法是隐藏页脚而不是隐藏页脚，我将其放在bottom以隐藏它直到被点击。 这个效果很好但是一旦点击它就可以向下滚动，之后就不会被隐藏了。 然后我决定隐藏/显示它，但这是按钮发生问题的地方。 由于页脚被隐藏，我无法将按钮放在页脚内。 由于按钮位于他的页脚之外，我试图为它设置动画，但它不会同时制作动画，这非常奇怪。 我做的最终解决方案是使用css3缓动，但它仍然不完美甚至可用，因为它是如何不刷新的。 我试图在准确的时间制作两个动画，同时看起来好像它们是一个对象。 这是我的HTML Open Footer 这是我的CSS footer { position: absolute; display: none; left: 0; bottom: 0; width: 100%; height: 20%; background: rgba(0, 0, 0, 0.69); } .fTab { width: 15%; height: 4em; position: absolute; bottom: 0; left: 2em; display: block; background: rgba(0, 0, 0, 0.69); […]

如何使用jQuery（或CSS）按列对HTML表进行排序？

我希望能够获取HTML表格，例如： translate.com & https://translate.google.com Bing Translator I eat tacos Yo como tacos Comer tacos I will eat a taco Voy a comer un taco Me voy a comer un taco I will eat tacos Voy a comer tacos Me voy a comer tacos I would eat a taco Me volvería a comer un taco Comer […]

使用Javascript / jQuery获取rotate3d值

具有以下转换的元素： style=”transform: rotate3d(1, 0, 0, -50deg);” 我希望能够使用Javascript / jQuery获得-50的值。 我想得到绝对值，所以如果它是370deg，我不想得到10，而是370。 使用$(‘#element’).css(‘transform’)返回如下矩阵： matrix3d(1, 0, 0, 0, 0, 0.642788, -0.766044, 0, 0, 0.766044, 0.642788, 0, 0, 0, 0, 1) 哪个可以更好地表示为： matrix3d( 1, 0, 0, 0, 0, 0.642788, -0.766044, 0, 0, 0.766044, 0.642788, 0, 0, 0, 0, 1 ) 解决方程是获得这个值的唯一方法吗？ 知道Z = 0和X = 1为rotate3d（1,0,0，-50deg）; 没有更快的替代方案吗？

撤消仅适用于首次替换的文本？

在这里我使用Ctrl + Z来撤消被替换的文本，我有一个场景，在文本区域，我有一个多个单词的句子，我选择第一个单词并用星号替换，后来我选择另一个单词并替换为星星。 但是当它按Ctrl + Z时它只适用于最新选择的单词而不适用于之前的单词。 JavaScript的： var selection = {}; function undo(e) { var evtobj = window.event? window.event : e; if (evtobj.keyCode == 90 && evtobj.ctrlKey && selection.text) { evtobj.preventDefault(); var txtarea = document.getElementById(“mytextarea”); var allText = txtarea.value; var newText = allText.substring(0, selection.start) + selection.text + allText.substring(selection.finish, allText.length); txtarea.value = newText; } } function […]

我可以在纯CSS而不是使用jQuery中执行此操作吗？

目前，我在window resize事件中使用jQuery设置一些元素的宽度和高度，基于window.innerWidth和window.innerHeight 。 像这样的东西： $(“.gr1”).css(“height”, (window.innerHeight – 150) + “px”); 这些是其他一些例子： $(“.gr2”).css(“width”, ((window.innerWidth / 2) – 12).toString() + “px”); $(“.box1”).css(“height”, ((window.innerHeight – 150) / 3 – 12).toString() + “px”); $(“.box2”).css(“height”, ((window.innerHeight – 150) / 2 – 12).toString() + “px”); 这在Chrome 21（Windows）中变得有点慢，在iPad和Nexus 7平板电脑上呈现得太慢。 （因为有很多元素有gr1 ， gr2 ， box1和box2类） 我可以在Pure CSS中执行此操作以获得更好的性能吗？ 怎么样？

CSS – 如何让一个相对元素跟我上下，但不是左右？

我有一个固定位置的父div，在div的内部我有一个相对位置的主div。 当我上下滚动它时，它跟着我（这是我想要的）但是当我从左到右（或从右到左）滚动条形图时我不希望它跟着我。 HTML： icons </div CSS： #wrapper { position: fixed; z-index: 1000; top: 155px; } #icons { width: 42px; position: relative; left: -67px; } 谢谢！！

具有缩略图滑块的全景360度查看器可单击并选择动态图像，以便在360度全景查看器中进行预览

我使用http://mrdoob.github.com/three.js/examples/webgl_panorama_equirectangular.html进行全景查看。 但我需要放一个滑块。 当我从滑块中单击图像时，必须用当前所选图像替换全景图像，并且全景360度必须应用于图像。 我无法显示我找到这样的例子的网站，因为没有直接链接。 下面是一个显示示例的图像 如图所示。 有一个缩略图图像，从中可以动态选择图像。 然后，所选图像显示在作为全景滑块的预览中。 这个function有没有滑块。 请发布链接。

一旦空间可用，立即开始重复

这是我迄今为止所用的笔。 我一直在使用CSS3但是我愿意使用其他方法，如果它能更好地工作： .userAttributes > .attributeGroup > .favoriteArtistsAttr { max-width: 74%; animation: marquee 10s linear infinite; } @keyframes marquee { 0% { text-indent: 0; } 100% { text-indent: -100%; } } 我希望大帐篷能够在p结束时滑入框架的那一刻开始重复。 我还需要用一个mousover停止并且可以滚动（这个部分已经工作）。 我发现这个例子可以实现我想要实现的目标。 我注意到他们是通过复制内容来实现的，但是我无法让它正常工作。 我也想知道这是否是实现我的目标的最佳方式，也许最好使用javascript或一些jquery插件？ 我想确保它在所有浏览器上都能正常工作（在合理范围内）

如何在jQuery mobile中获取选中的单选按钮值？

我有一组单选按钮组。 如何为每个组检查是或现在检查哪个并将它们添加到arrays？ 这是我到目前为止所得到的： 我的jquery代码： $(function () { $(“#getinfo”).click(function () { $(“input[name*=radio-choice-1]:checked”).each(function () { alert($(this).val()); }); }); }); 和单选按钮 Yes No Yes No Yes No Yes No getinfo

在CSS网格布局中填充空单元格

我有一组div瓷砖，我通过CSS网格布局尽可能“自动”排列; 我最后的想法是，即使我不知道有多少瓷砖，它们都会得到正确的尺寸和放置。 这工作正常。 现在，我希望将所点击的任何图块的区域加倍。 据我所知，这意味着增加这个瓷砖的范围： grid-row: span 2; grid-column: span 2; 如果我点击不在最右边的列中的任何图块，我对结果感到满意。 当最右边的瓷砖展开时，它们会被包裹到下一行。 有没有办法强制这些瓷砖向左扩展，以便包裹其他非活动瓷砖？ Codepen示例在这里 $(‘div.tile’).click(function() { $(‘div.tile’).not(this).removeClass(‘chosen’); $(this).toggleClass(‘chosen’); /* Attempt to find current placement, to see if we could change the span rules based on results. Probably disregard. */ var colCount = $(‘div.wrapper’).css(‘grid-template-columns’).split(‘ ‘).length; console.log(colCount); var placement = $(this).css(‘grid-row’); console.log(placement); }); body { margin: […]