Tag: css

如何反转嵌套子元素的顺序: 假设我有以下HTML代码 HTML CSS .a, .b, .c { width: 100px; height: 100px; position: relative; } .a { background: red; z-index: 999; } .b { background: green; margin: 40px; z-index: 500; } .c { background: gray; margin: 40px; z-index: 100; } 现在，我希望它完全相反，即最重要的是红色。我尝试使用位置设置为relative z-index，但它不起作用。这是jsfiddle演示

通过HEX或RGB获取颜色名称: 如何使用JS / JQuery获取颜色名称，知道代码RBG / HEX？例如： Colorname RGB black #000000 white #FFFFFF red #FF0000 green #008000

在滚动上更改div的背景颜色: http://jsfiddle.net/ncuydr9y/ BG颜色在启动时应为＃1A1A1A，然后在滚动210像素后更改。不知道我哪里出错了。 $(document).ready(function(){ var scroll_pos = 0; $(document).scroll(function() { scroll_pos = $(this).scrollTop(); if(scroll_pos > 210) { $(“#left-panel”).css(‘background-color’, ‘#1A1A1A’); } else { $(“#left-panel”).css(‘background-color’, ‘red’); } }); });

Jquery自定义属性: 我正在考虑在Jquery中使用自定义属性来避免使用class或id属性，以免干扰html设计器。考虑到这个想法，html应该是这样的：你认为这是一个好方法吗？您对这些自定义属性的W3Cvalidation有何看法？你知道如何用Jquery编程而不干扰html设计师的工作吗？关于性能，我认为使用类属性或id，jquery选择器比使用自定义属性和过滤函数（如“contains，etc …”）更快。这是正确的吗？

jquery移动背景图像: 我正在构建一个jQuery移动网站，我正在尝试将可缩放图像插入到背景中，这将调整到手机的屏幕大小。这是我的代码： Discover Dubrovnik .ui-page { background: transparent url(image.gif); } Header tex some text Neki izbornik 当窗口全屏时，我得到背景图像，但是当我调整它/缩小它时（比如手机中的屏幕），图像没有resize并且没有居中，所以我只能看到它的一部分… 连接的jQuery和CSS文件从jquerymobile.com下载

性能：纯CSS与jQuery: 我已经看到了纯CSS和等效的jQuery之间的一些代码比较。但我正在寻找有关为什么纯CSS比jQuery明确更快的细节。这是我见过的一些原因，但这些描述并不深入。我不确定它们是否真实。 CSS不必由浏览器评估 jQuery必须由浏览器进行评估 jQuery使用脚本语言 CSS是否必须由浏览器进行评估并且还要使用脚本语言？ CSS不像jQuery那样走DOM，还是CSS有优势呢？

Bootstrap 4文件输入: 我正在努力使用bootstrap 4文件浏览器。如果我使用自定义文件控件，我会一直看到选择文件值。 https://v4-alpha.getbootstrap.com/components/forms/#file-browser 我想在选择文件后更改选择文件的值。这个值实际上隐藏在css .custom-file-control:lang(en)::after ，我不知道如何在javascript中访问和更改它。我可以像这样得到所选文件的值： document.getElementById(“exampleInputFile”).value.split(“\\”).pop(); 不是我需要改变 .custom-file-control:lang(en)::after { content: “Choose file…”; } 不知何故链接： http ： //codepen.io/Matoo125/pen/LWobNp

如何从twitter bootstrap将活动类设置为导航菜单: 我是twitter新手的新手。在那里使用导航菜单。我正在尝试将活动类设置为所选菜单。我的菜单是 – Home Project Customer Staff Broker Sale 谷歌搜索后我尝试了跟随的事情，我必须从菜单中设置每个页面上的活动类，如as– $(document).ready(function () { $(‘#home’).addClass(‘active’); }); 但上面的问题是我设置了默认选择的主菜单。然后它总是被选中。有没有其他方法可以做到这一点？，或者我可以概括并保持我的js在布局文件本身？执行应用程序后，我的菜单显示点击其他菜单项后，我得到以下结果 – 我在Index视图和Broker视图中添加了以下脚本— $(document).ready(function () { $(‘#home’).addClass(‘active’); }); $(document).ready(function () { $(‘#broker’).addClass(‘active’); }); 分别。

Bootstrap，jQuery，Popper和CSS加载顺序: 我不确定我的加载顺序是否正确。有人可以确定吗？在“头”：在“身体”： <script src="js/bootstrap.js" <script src="js/jquery-3.2.1.min.js" <script src="js/jquery-slim.min.js" <script src="js/popper.min.js"

Tumblr风格的UserHoverCard: 大家好，我有一个问题与ajaxhover。我正在尝试像tumblr一样创建userHoverCard。但是当我将它与ajax一起使用时，hover动画无效。这是工作DEMO没有ajax只有CSS。在此演示中，您可以看到当您hover图像时，然后.p-tooltip将以动画效果打开。但是，如果您从我的测试页面单击此演示，那么您可以看到当您hover图像时.p-tooltip将无法打开动画效果。 HTML 这是我的ajax代码： $(document).ready(function() { function showProfileTooltip(e, id){ e.append($(‘.p-tooltip’).css({ ‘top’:’20’, ‘left’:’80’ }).show()); //send id & get info from get_profile.php $.ajax({ url: ‘get_profile.php?uid=’+id, beforeSend: function(){ $(‘.p-tooltip’).html(‘Loading..’); }, success: function(html){ $(‘.p-tooltip’).html(html); } }); } function hideProfileTooltip(){ $(‘.p-tooltip’).hide().fadeIn(‘fast’); } $(‘.summary a’).hover(function(e){ var id = $(this).attr(‘data-id’); showProfileTooltip($(this), id); }, function(){ setTimeout(function(){ hideProfileTooltip(); },2000); […]