Tag: css

为同一个类的divs随机添加的类: 我有几个同一类的div。我想随机地为每个div添加一个（不同的）类，但是没有在彼此之后重复添加类。这是我的示例html： some text here some other text here some more text here some more text here some more text here 应该添加的示例css： .addedclass1 {…} .addedclass2 {…} .addedclass2 {…} .addedclass3 {…} .addedclass4 {…} 我最终会喜欢看到的： some text here some other text here some more text here some more text here some more text here 我有一些随机化添加的类的jquery，但它允许重复： $(document).ready(function() […]

jquery选择处理位置绝对的重叠问题: 我有一个固定的容器，我在其中显示一些表单元素，还有一个选择了jquery的select元素。问题是我需要显示在容器上方选择的下拉区域，为此我需要设置.chosen-container {position: absolute}但是在将固定区域滚动后将其设置为绝对时，所选择的仍然是固定的地点。怎么解决？ css代码： #fixed { border: 1px solid #000; width: 300px; height: 180px; overflow: auto; } .chosen-container { position: absolute; } .txt { display: block; margin: 10px 0; } HTML代码： Val 1 Val 2 Val 3 Val 4 Val 5 Val 6 Val 7

如何使用jQuery serialScroll / scrollTo（不工作）: 我正在努力，试图让JQuery ScrollTo插件正常工作。我想以编程方式将其滚动到下一个和上一个项目。现在，当然我已经看过类似的问题（和相关的小提琴），但我似乎无法让它适用于我的场景。我试图在这个小提琴中设置它。我试图获得这个位置并且浮动正确。任何帮助表示赞赏。提前致谢。 http://jsfiddle.net/twashing/ukEfp/21

单击链接时更改照片不透明度: 我试图在他们的类别之上创建一个照片库。如何在单击类别链接时使特定照片的不透明度增加（或减少）？我不确定我是否可以用css实现这一点。感谢每一位帮助

在按下选项卡时，它不会移动到下一个选项卡: 我正在使用html css和jquery创建选项卡。我没有使用jquery ui。让我解释一下这个问题。在选项卡中有许多选项卡。每个选项卡包含texbox，下拉列表，复选框等，例如当用户在第一个选项卡中时。在此选项卡中有文本框。当用户按Tab键时到达最后一个文本框时，它将移动到下一个标签的第一个元素（如文本框/下拉列表等）。我创建了这个，但它没有移动到标签文本框。代码在pastebin和js小提琴上可用。我找不到我的代码有什么问题。如果你需要任何澄清，请问我注意：请不要建议tabindex。我想用jquery做。链接：关于jsfiddle粘贴盒的演示： – http://pastebin.com/E85NsNtg jQuery Tabs Demo * {padding:0; margin:0;} html { background:url(/img/tiles/wood.png) 0 0 repeat; padding:15px 15px 0; font-family:sans-serif; font-size:14px; } p, h3 { margin-bottom:15px; } div { padding:10px; width:600px; background:#fff; } .tabs li { list-style:none; display:inline; } .tabs a […]

与Jquery不同，当宽度屏幕为1050px时删除类: 好的我现在知道如何删除窗口宽度的abd add class。但现在我正在努力解决这个问题：我要这个： var num = 90; //number of pixels before modifying styles $(window).bind(‘scroll’, function () { if ($(window).scrollTop() > num) { $(‘#menu2’).addClass(‘f-nav’); } else { $(‘#menu2’).removeClass(‘f-nav’); } }); 使用这个： function checkWidth() { if ($(window).width() > 1049) { $(‘#menu2’).addClass(‘f-nav’); } else { $(‘#menu2’).removeClass(‘f-nav’); } } $(window).resize(checkWidth); 换句话说，当我滚动它必须添加一个类，但是当它resize时它必须删除类+它也必须在我向上滚动时删除。

IE7的Galleriffic插件问题: 我正在使用Galleriffic插件来制作自定义幻灯片库。除IE 7外，它在每个主流浏览器（IE 8，Firefox 3.6.x，Safari和Chrome）中运行良好。它在IE 7中做了最奇怪的事情，它不会显示图像，正在显示div但是图像没有被加载到它中。链接图片的两种方式仍然不会带来（完整链接，如： http ： //www.google.com/logos/2010/xraydiscovery2010-ps.gif和本地链接，如：images / slideshow / image1。 JPG格式）。有没有人遇到过这个问题，可以就如何解决这个问题提供一些指导？谢谢。

为什么我不能通过ID（无iframes）访问这个动态加载的DOM元素？: 我正在使用允许嵌入式JavaScript内容（Qualtrics）的外部网站。 Qualtrics动态加载一些控制器。当我通过Chrome网络面板测试访问这些控制器时，在完全加载后，我可以在Elements窗口中看到加载的控制器，它代表当前的DOM。但是，我无法通过id访问这些元素，无论是使用jQuery还是通过document.getElementById。其中一个控制器具有id QID12~14~handle 。在Elements DOM浏览器中，我看到了标记：当我查看页面的源代码时，我看到它们是动态加载的，并通过脚本标记插入到页面中： QModules.loadExternalModule(‘../WRQualtricsShared/JavaScript/CSBar/slider.51487.js’, function () { (function () { CS_QID15 = new CSBar(‘0’, ‘100’, ’10’, ‘QID15’, ”); if (CS_QID15.loaded) { CS_QID15.setDecimals(0); if (CS_QID15.snapToGrid) { CS_QID15.makeSlider(‘QID15~1’); CS_QID15.makeSlider(‘QID15~2’); CS_QID15.setStartPositions({“1”: 0, “2”: 0, “3”: 0.64599483204134}); } else { CS_QID15.makeSlider(‘QID15~1’); CS_QID15.makeSlider(‘QID15~2’); CS_QID15.setStartPositions({“1”: 0, “2”: 0, “3”: 0.64599483204134}); } } }).delay(); //if […]

进度条宽度: 我的代码旨在通过计算百分比并将其作为style.width传递来设置进度条的宽度。我是新手，所以为坏代码道歉： JQuery的 $(document).ready(function() { var width=(1/5*100); $(‘#progress_bar’).css(‘width’,’=width + “%”‘); }); HTML 有没有第二个空闲的人请帮助我让它工作，并告诉我我哪里出错了所以我可以从中学到什么？ http://jsfiddle.net/SyxAM/

自动调整文本输入框html: 我创建了一个输入（类型文本）框，使其自动resize非常简单。但是，有一些我似乎无法修复的故障：当我开始输入时，盒子缩小了一点点当我按退格键（或方向箭头）时，该框首先展开，然后在我继续键入时缩小。这是我的代码： function Expander() { this.start = function () { $(“#inputbox”).keydown(function(e) { this.style.width = 0; var newWidth = this.scrollWidth + 10; if( this.scrollWidth >= this.clientWidth ) newWidth += 10; this.style.width = newWidth + ‘px’; }); } } $(function() { window.app = new Expander(); window.app.start(); }); input { margin-left:3em; min-width:100px; max-width:600px; }