2013-01-18 16 views
0

我想要两个jQuery翻转开关在一行中,当屏幕太窄时,其中一个不可见。jquery分类没有使用div的翻转开关

对于他们被区别对待,他们需要分配不同的类,但不知何故不起作用。当类或id分配给p或div时,条件起作用,但那些元素不会显示在同一行中。

如何给他们分配一些类,同时保持他们在一行?

+0

你能告诉我们一些代码吗?也许[小提琴](http://jsfiddle.net/)? –

+0

当然: http://jsbin.com/inunev/4/edit。 BOt翻转显然是由div设置控制的; bigga类适用于其中一个没有任何区别。 – secr

回答

0

最好的办法是使用一行两列的表格。

+0

你能为此提供一些代码吗?能够帮助他人回答您的问题真是太好了,但您的问题和答案都缺乏可帮助任何人找到答案的代码和背景。 –

+0

http://jsbin.com/acibuj/1/edit – secr

0

这里是通过css完成的相同的事情,据说它比js更适合于对象定位。的确,对于这个版本,当你改变实时模式的分辨率时,dreamweaver立即响应。

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<link rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"> 
</script><script src="https://ajax.aspnetcdn.com/ajax/jquery.mobile/1.2.0/jquery.mobile-1.2.0.min.js"> </script> 
<style> 
@media screen and (min-width:1px) and (max-width:319px) { 
.bigga { 
    display: none; 
} 
} 
div.ui-slider-switch { 
    width: 7em 
} 
</style> 
</head> 

<body> 
<table width="200" border="0"> 
    <tr> 
    <td><div align="center" class="bigga"> 
     <select data-role="slider" > 
      <option value="off">boy</option> 
      <option value="on"> girl</option> 
     </select> 
     </div></td> 
    <td><div align="center"> 
     <form > 
      <select data-role="slider" > 
      <option value="off" accesskey="" >man</option> 
      <option value="on" > woman</option> 
      </select> 
     </form> 
     </div></td> 
    </tr> 
</table> 
</body> 
</html>