我有一个固定位置的标题(动态高度).
我需要将容器div放在标题下方.由于标题高度是动态的,我不能使用固定值作为上边距.
如何才能做到这一点?
这是我的CSS:
#header-wrap {
position: fixed;
height: auto;
width: 100%;
z-index: 100
}
#container{
/*Need to write css to start this div below the fixed header without mentioning top margin/paading*/
}
Run Code Online (Sandbox Code Playgroud)
......和HTML:
<div id="header-wrap">
<div id="header">
<div id="menu">
<ul>
<li><a href="#" class="active">test 0</a></li>
<li><a href="#">Give Me <br />test</a></li>
<li><a href="#">My <br />test 2</a></li>
<li><a href="#">test 4</a></li>
</ul>
</div>
<div class="clear">
</div>
</div>
</div><!-- End of header -->
<div id="container">
</div>
Run Code Online (Sandbox Code Playgroud) 我想知道将p元素中的文本对齐为垂直居中.
这是我的风格:
p.event_desc {
font: bold 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
line-height: 14px;
height: 35px;
margin: 0px;
}
Run Code Online (Sandbox Code Playgroud)
和HTML:
<p class="event_desc">Lorem ipsum.</p>
Run Code Online (Sandbox Code Playgroud) 我给了单选按钮的bg图像.它使用的是chrome,但不是mozilla.
这是我的代码
<div class="fieldlist">
<label for="shipadd2">
<input type="radio" id="shipadd2" name="address" />
<div class="compacttext"> Lorem ipsum </div>
</label>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS是
.fieldlist input[type="radio"] {
float: right;
-webkit-appearance: none;
border: none;
width: 25px;
height: 25px;
background: url(images/radio.png) left center no-repeat;
background-size: 20px;
}
.fieldlist input[type="radio"]:checked {
background: url(images/radio_checked.png) left center no-repeat;
}
Run Code Online (Sandbox Code Playgroud) 我正在使用以下过程从JavaScript修改CSS,但它没有给出任何结果.
任何人都可以检查代码,让我知道正确的方法.我需要半径的桌子边框.
这是我的表结构:
<table id="tt" width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="179" class="header_links">5<input name="input" class="lang_textbox" type="text" value="Search by keyword" /></td>
<td width="52" align="left"><img src="images/search_go.jpg" width="28" height="24" alt="go" /></td>
<td width="169" class="header_links"><a href="#">FAQs</a> | <a href="#">Sitemap</a> | <a href="#">Contact us</a></td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
以下是正在使用的javascript
document.getElementById('tt').style.borderRadius = '4em'; // w3c
document.getElementById('tt').style.MozBorderRadius = '4em'; // mozilla
document.getElementById('tt').style.border = '4em'; // mozilla
Run Code Online (Sandbox Code Playgroud) 如何将xml文件内容加载到div.
这是我需要加载XML内容的HTML
<div class="editorial" id="news-container">
</div>
Run Code Online (Sandbox Code Playgroud)
XML数据
<contentprogramming>
<category name = "My t" id = "1">
<logo>http://123.png</logo>
<channel name="res" id= "1" type="ecommerce">
<logo>http://11.png</logo>
<items>
<item id="1">
<image>http://11.jpg</image>
<title>Memory Card MSMT2G</title>
<details>$6.99</details>
<linkurl>http://www.test.com/Sony</linkurl>
</item>
<item id="2">
<image>http://i2.jpg</image>
<title>Apple iPad </title>
<details>$579.95</details>
<linkurl>http://www.test.com/Apple</linkurl>
</item>
</items>
</channel>
</category>
</contentprogramming>
Run Code Online (Sandbox Code Playgroud)
而xml文件名是 something.xml
我尝试了几种方法,但它没有用:(
我尝试了下面的方法,但没有奏效.
$('something.xml').find('name').each(function() {
$("#news-container").append($(this).text() + "<br />");
});
Run Code Online (Sandbox Code Playgroud) 我在滑动内容面板中实现了幻灯片放映中的内容淡入淡出.
幻灯片放映在滑动面板的第一个li中,但问题是因为滑动随机移动我无法显示幻灯片放映.
我需要的是,Sliding应该等到幻灯片完成动画.完成幻灯片放映后,滑动面板的下一个li应该出现.
这是用于此的代码
//Fade in slide show
var quotes = $(".inner_detail div");
var quoteIndex = -1;
function showNextQuote() {
++quoteIndex;
quotes.eq(quoteIndex % quotes.length)
.fadeIn(2000)
.delay(2000)
.fadeOut(2000, showNextQuote);
}
showNextQuote();
//Slider
$('#news-container').vTicker({
speed: 800,
pause: 3000,
animation: 'fade',
mousePause: false,
showItems: 1
});
Run Code Online (Sandbox Code Playgroud)
如果您想看幻灯片效果,请删除js中的滑块代码,然后您可以看到幻灯片的工作原理.(这里只是一个小提琴,只显示幻灯片)
这是工作DEMO(在这个演示中,第一个滑动的li有幻灯片div,因为滑动快速移动而无法看到)
提前致谢...
我正在使用一个有很多工具提示的html页面.每个工具提示都有一个图库,因为不可能使用具有相同ID的多个图库,我打算为图库创建6个不同的html文件,然后将图库加载到我的默认页面.
我需要为每个div调整html页面.我试过.load但它没有用.
<div id="flrmain">need to call the html file inside this div.<div>
Run Code Online (Sandbox Code Playgroud)
请帮忙.
我知道这与编码问题无关,但在我开始研究这个场景之前,我想得到一些指导.
方案是提供更改页面主题的选项.我决定的是,为多个元素提供通用类
因此,我将使用不同颜色的这些类名创建多个样式表.
但困难在于每个元素的定位.我想为每个元素提供内联样式来定义与位置相关的东西.例如
.image {border:grey solid 1px /*this border color will be different in each stylesheet*/}
<div class="image" style="float:right; margin:6px"><img src="" /> </div>
Run Code Online (Sandbox Code Playgroud)
因此,所有其他元素都将具有用于对齐目的的内联css.
你认为这是实现主题场景的最佳方式吗?
PS - 用户可以自定义主题.(我们正在编辑面板).这实际上不是网页,它是一个产品模块(就像我们改变Powepont图形和图表的颜色一样).
我创建了一个表单.这是小提琴
默认情况下,所有字段都处于只读状态.我需要做的是
当用户点击Edit button并编辑按钮(名称和值)时,激活文本字段进行编辑SAVE button.
编辑完成后,用户应该点击Save button它,它应该再次执行第一步,意味着将按钮更改回原始状态,即Edit文本字段为readonly
最好寻找jquery解决方案.
预先感谢!!
我需要添加多个输入框来输入数据.最初只有一个输入框,每个生成的输入框旁边都有一个"添加"按钮,用于生成多个文本框.
如果你看看我的小提琴,在第一级有3级文本框,它可以选择只输入1级数据但是当它达到2级时,应该有一个选项来创建相同父级的第二级,这样我们就可以了可以输入主标题的子数据.例如,如果我写州名,那么我应该能够输入子类别..
这是第1级菜单的代码
$(document).ready(function(){
$(":radio").click(function(){
$(".test").hide();
var show = $(this).attr("data-show");
$("#"+show).show(300)
});
$('.sort').hide();
$filtr = $('.filtr');
$filtr.on('click', '.add', function(){
$(this).closest('.loop').clone().appendTo( $(this).closest('.test') );
$('.sort').show();
});
$filtr.on('click', '.del', function(){
$(this).closest('.loop').remove();
});
$('#1lev, #2lev, #3lev').hide();
//For sort up/down
function moveUp(item) {
var prev = item.prev();
if (prev.length == 0)
return;
prev.css('z-index', 999).css('position','relative').animate({ top: item.height() }, 250);
item.css('z-index', 1000).css('position', 'relative').animate({ top: '-' + prev.height() }, 300, function () {
prev.css('z-index', '').css('top', '').css('position', '');
item.css('z-index', '').css('top', '').css('position', '');
item.insertBefore(prev);
});
}
function moveDown(item) {
var …Run Code Online (Sandbox Code Playgroud)