我正在构建一个jQuery移动网站,我正在尝试将可缩放图像插入到背景中,这将调整到手机的屏幕大小.这是我的代码:
<!DOCTYPE html>
<html>
<head>
<title>Discover Dubrovnik</title>
<link rel="stylesheet" href="jquery.mobile-1.0a4.1.min.css" />
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="jquery.mobile-1.0a4.1.min.js"></script>
<style type="text/css">
.ui-page {
background: transparent url(image.gif);
}
</style>
</head>
<body>
<div data-role="page" data-theme="b">
<div data-role="header">
<h1>Header tex</h1>
</div><!-- /header -->
<div data-role="content" data-theme="d">
some text
</div><!-- /content -->
<div data-role="footer">
<h1>Neki izbornik</h1>
</div>
</div><!-- /page -->
当窗口全屏时,我得到背景图像,但是当我调整它/缩小它时(比如电话中的屏幕),图像没有调整大小并且没有居中,所以我只能看到它的一部分...
连接的jQuery和CSS文件从jquerymobile.com下载
我有一个UL包含多个链接的列表,每个项目都链接到它自己的链接DIV.当用户将鼠标悬停在UL链接上时,DIV会显示正确的框.
这是我的HTML代码:
<ul class="productlist">
<li><a href="#" id="link0" class="product-link">Link 1</a></li>
<li><a href="#" id="link2" class="product-link">Link 2</a></li>
<li><a href="#" id="link3" class="product-link">Link 3</a></li>
</ul>
<div class="panel-overview boxlink" id="boxlink0"> Something goes here 1 </div>
<div class="panel-overview boxlink" id="boxlink1"> Something goes here 2 </div>
<div class="panel-overview boxlink" id="boxlink2"> Something goes here 3 </div>
以及使其工作的JavaScript(不是JavaScript专家,抱歉):
<script>
$(function() {
var $boxes = $('.boxlink');
$('.productlist .product-link').mouseover(function() {
$boxes.hide().filter('#box' + this.id).show();
});
});
</script>
我想知道如何让盒子每隔3到4秒自动滚动一次.因此,例如,首先DIV打开3秒,然后是第二个,然后是第三个......
这是现场网站,因为我还没有真正描述它.
我就直接进入正题吧。我有一个宽度为 100% 的子 div，它位于宽度固定的包装器下。我想知道如何使子 div“突破”并具有 100% 全屏页面宽度。代码是这样的，我尝试使用相对/绝对定位，但没有运气。
<div class="wrapper">
...Some other code...
<div class="banners">
<div class="first"><img src="http://placehold.it/200x200"></div>
<div class="second"><img src="http://placehold.it/200x200"></div>
</div>
...Some other code...
</div>
小提琴可以在这里找到http://jsfiddle.net/qMYQw/
除了“横幅”div 之外，该 div 的上方和下方还有一些其他部分，这就是“横幅”位于包装器中的原因
PS 横幅 DIV 上方/下方还有其他部分，因此仅设置位置：绝对并不能解决问题
我面临着非常烦人的问题.我有2个div像bellow,第一个div是产品图像,第二个是叠加,当用户将鼠标悬停在产品图像上时应该显示.它确实有效,但是当图像悬停时,叠加不会停止闪烁.我通过设置不透明度尝试了一些"黑客",没有任何作用.
<div class="product-container">
<div class="product-image"><img src="http://placehold.it/200x200">
<div class="overlay">PRICE</div>
</div>
URL是http://jsfiddle.net/MZ3eE/ 我知道JS可以使用,但在这种情况下我需要纯CSS解决方案.
我有一个DIV(.container)和一个button(.btn),我想隐藏,直到页面完全加载.我设法通过在一个小jquery片段上使用dispay:none来做到这一点,但如果我可以使用visibillity会更好:隐藏因为页面不会移动(就像显示:) none.
基本上,我有:
<style>
.container {visibility:hidden;}
.btn {visibility:hidden;}
</style
是否有任何可以帮助我的好灵魂,jquery所以只有在页面完全加载后它才显示出来？