1
你好Stackoverflowers -Fancybox无法正常工作？可能是脚本？
有点在这个网站混淆，并寻找一个坚实的答案，在我做错了什么？ - 目前，此页面上的链接不能正常工作，这是更多：
的fancybox是一个相当简单的“复制和粘贴”的教程，我已经在使用它另外两个网站，所以我对它很熟悉;为了公平起见，这并不是那么困难！这就是为什么它错误地问我在这里，因为我知道这样简单的问题可以降低堆栈溢出的质量，但没有论坛或其他主题正在解决我的问题;所以这是我的最后一招。
我已经使用萤火虫查看了该网站，当我查看脚本的时候，它将在脚本中重新加载当前页面而不是JS文档，但路径是100％正确的。
那么他们正在加载？
我的代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Pixelize.net - Digital & Web Design Agency</title>
<link rel="stylesheet" href="http://pixelize.net/wp-content/themes/blue-and-grey/style.css" type="text/css" media="screen" />
<!--[if lt ie 8]><link rel="stylesheet" href="http://pixelize.net/wp-content/themes/blue-and-grey/styles/ie7.css" type="text/css" /><![endif]-->
<!--[if lt ie 7]><link rel="stylesheet" href="http://pixelize.net/wp-content/themes/blue-and-grey/styles/ie6.css" type="text/css" /><![endif]-->
<link rel="pingback" href="http://pixelize.net/xmlrpc.php" />
<!--FANCYBOX-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://www.pixelize.net/wp-content/themes/blue-and-grey/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" href="http://www.pixelize.net/wp-content/themes/blue-and-grey/fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
<!--FANCY BOX JQUERY-->
<script>
jQuery(document).ready(function() {
/* This is basic - uses default settings */
$("a#single_image").fancybox();
/* Using custom settings */
$("a.inline").fancybox({
'hideOnContentClick': true
});
/* Apply fancybox to multiple items */
$("a.group").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 1000,
'speedOut' : 800,
'overlayShow' : false
});
});
</script>
<!--NivoSlider-->
<link rel="stylesheet" href="http://www.pixelize.net/wp-content/themes/blue-and-grey/default/nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="http://www.pixelize.net/wp-content/themes/blue-and-grey/default/default.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://www.pixelize.net/wp-content/themes/blue-and-grey/default/jquery.nivo.pack.slider.js" type="text/javascript"></script>
<script src="http://www.pixelize.net/wp-content/themes/blue-and-grey/default/jquery.nivo.slider.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
$(window).load(function() {
$('#slider').nivoSlider({
effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
slices: 15, // For slice animations
boxCols: 8, // For box animations
boxRows: 4, // For box animations
animSpeed: 500, // Slide transition speed
pauseTime: 3000, // How long each slide will show
startSlide: 0, // Set starting Slide (0 index)
directionNav: false, // Next & Prev navigation
directionNavHide: false, // Only show on hover
controlNav: false, // 1,2,3... navigation
controlNavThumbs: false, // Use thumbnails for Control Nav
controlNavThumbsFromRel: false, // Use image rel for thumbs
controlNavThumbsSearch: '.jpg', // Replace this with...
controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
keyboardNav: true, // Use left & right arrows
pauseOnHover: true, // Stop animation while hovering
manualAdvance: false, // Force manual transitions
captionOpacity: 0.8, // Universal caption opacity
prevText: '', // Prev directionNav text
nextText: '', // Next directionNav text
randomStart: false, // Start on a random slide
beforeChange: function(){}, // Triggers before a slide transition
afterChange: function(){}, // Triggers after a slide transition
slideshowEnd: function(){}, // Triggers after all slides have been shown
lastSlide: function(){}, // Triggers when last slide is shown
afterLoad: function(){} // Triggers when slider has loaded
});
});
});
</script>
<!--End Of NivoSlider-->
<link rel="alternate" type="application/rss+xml" title="Pixelize - Digital & Web Design Agency » Feed" href="http://pixelize.net/feed/" />
<link rel="alternate" type="application/rss+xml" title="Pixelize - Digital & Web Design Agency » Comments Feed" href="http://pixelize.net/comments/feed/" />
<link rel='stylesheet' id='admin-bar-css' href='http://pixelize.net/wp-includes/css/admin-bar.css?ver=20111209' type='text/css' media='all' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://pixelize.net/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://pixelize.net/wp-includes/wlwmanifest.xml" />
<link rel='prev' title='works' href='http://pixelize.net/works/' />
<link rel='next' title='blog' href='http://pixelize.net/blog/' />
<meta name="generator" content="WordPress 3.3.1" />
<link rel='canonical' href='http://pixelize.net/services/' />
<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
<style type="text/css" media="print">#wpadminbar { display:none; }</style>
<style type="text/css" media="screen">
html { margin-top: 28px !important; }
* html body { margin-top: 28px !important; }
</style>
</head>
<body class="page page-id-5 page-template page-template-services-php logged-in admin-bar" style="border-top: 10px solid #FFFFFF;">
<div class="header">
<div class="pixelize-searchform">
<form method="get" class="searchform" action="http://pixelize.net/">
<fieldset>
<input type="text" value="" name="s" id="s" />
<button type="submit" id="searchsubmit" value="Search">search</button>
</fieldset>
</form>
</div>
<div class="header-menu">
<ul class="menu"><li class="page_item page-item-10"><a href="http://pixelize.net/blog/"><span><span>blog</span></span></a></li>
<li class="page_item page-item-2"><a href="http://pixelize.net/works/"><span><span>works</span></span></a></li>
<li class="page_item page-item-5 current_page_item"><a href="http://pixelize.net/services/"><span><span>services</span></span></a></li>
<li class="page_item page-item-27"><a href="http://pixelize.net/"><span><span>home</span></span></a></li>
</ul></div>
</div>
<div class="content">
<div class="main">
<div class="post-5 page type-page status-publish hentry" id="post-5">
<h1 class="content-title">services</h1>
<div class="pixelize-stretchbg">
<img src="http://pixelize.net/wp-content/themes/blue-and-grey/images/internet.png" style="margin-top:5px;" alt="Pixelize Internet Services" height="100" width="100" />
<h2>Website Design</h2>
<p>At Pixelize we design and develop web sites that are tailored to suit your business needs, we aim to significantly increase your sales and expand your client base. After meetings and topics have been discussed we will ask for the informative criteria to follow from your detailed brief that outlines your business objectives; we approach each web design project with both creative and commercial results in mind.</p>
<ul>
<li><a class="inline" href="#data">Read More</a></li>
<span style="color:#000000;"> | </span>
<li><a class="inline" href="#data2">View 'Folio</a></li>
</ul>
<div style="display:none">
<div id="data">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</div>
<div style="display:none">
<div id="data2">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</div>
<div class="clear"></div>
<div class="pixelize-maxinside">
<img src="http://pixelize.net/wp-content/themes/blue-and-grey/images/chart.png" style="margin-top:10px;" alt="Search Engine Optimization and Marketing Services" height="100" width="100" />
<h2>Search Engine Optimization and Marketing Services</h2>
<p>Once your website is designed exactly to your needs! Our next step is to increase the rankings of your website, Search Engine Optimisation (SEO) helps to increase your website rankings in an organic way, (to ensure that search engines do not recognise your website as generic spam). Better visibility in the search engines and a marketing campaign pinpointed to your exact demographic will ensure that no website downfalls will exist.</p>
<ul><li><a href="#" style="color: #F900CD;">Read More</a></li><span style="color:#000000;"> | </span><li><a href="#" style="color: #F900CD;">View 'Folio</a></li></ul>
</div>
<div class="clear"></div>
<img src="http://pixelize.net/wp-content/themes/blue-and-grey/images/logoservice.png" alt="Graphic & Logo Design Services" height="100" width="100" />
<h2>Graphic & Logo Design</h2>
<p>Graphic and logo design can take many forms, from magazine advertising, POS material, packaging and event leaflet design. Pixelize holds years of experience in all areas of print, brand and web development. We tackle all areas of graphic design with our creative designers that approach every project from a completely different angle.</p>
<ul><li><a href="#" style="color: #F900CD;">Read More</a></li><span style="color:#000000;"> | </span><li><a href="#" style="color: #F900CD;">View 'Folio</a></li></ul>
<div class="clear"></div>
<div class="pixelize-maxinside">
<img src="http://pixelize.net/wp-content/themes/blue-and-grey/images/logo.png" style="margin:40px 5px 0px 5px;" alt="Branding Services" width="101" />
<h2>Branding Services</h2>
<p>Your brand and your corporate identity is key to any companies success, It represents the face of the company and the information and expectations that your customers associate your company with. This therefore makes your brand the most powerful element within your company. At Pixelize we will target your demographic to gain an understanding of the needs that are required to develop your new found brand to perform at its very best.</p>
<ul><li><a href="#" style="color: #F900CD;">Read More</a></li><span style="color:#000000;"> | </span><li><a href="#" style="color: #F900CD;">View 'Folio</a></li></ul>
</div>
<div class="clear"></div>
<img src="http://pixelize.net/wp-content/themes/blue-and-grey/images/video.png" alt="Video Services" height="100" width="100" />
<h2>Video Services</h2>
<p>Pixelize offering a one of a kind bespoke video service, offered through our graduate scheme. Specialising in event and corporate filming. We create professional cinematic products shot in full HD, using innovative techniques and shooting styles to ensure a high standard and original end product, perfect for your business or even memories of your special day.</p>
<ul><li><a href="#" style="color: #F900CD;">Read More</a></li><span style="color:#000000;"> | </span><li><a href="#" style="color: #F900CD;">View 'Folio</a></li></ul>
</div>
<div class="clear"></div>
<p><a class="post-edit-link" href="http://pixelize.net/wp-admin/post.php?post=5&action=edit" title="Edit Page">Edit this entry.</a></p></div>
</div></div>
<div class="pixelize-footer">
<ul>
<li><a href="http://www.pixelize.net">home</a></li>
<li>services</li>
<li>our work</li>
<li>about</li>
<li style="margin-right:0px;">contact</li>
</ul>
</div>
<script type='text/javascript' src='http://pixelize.net/wp-includes/js/admin-bar.js?ver=20111130'></script>
<div id="wpadminbar" class="nojq nojs" role="navigation">
<div class="quicklinks">
<ul id="wp-admin-bar-root-default" class="ab-top-menu">
<li id="wp-admin-bar-wp-logo" class="menupop"><a class="ab-item" tabindex="10" aria-haspopup="true" href="http://pixelize.net/wp-admin/about.php" title="About WordPress"><span class="ab-icon"></span></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-wp-logo-default" class="ab-submenu">
<li id="wp-admin-bar-about" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/about.php">About WordPress</a> </li></ul><ul id="wp-admin-bar-wp-logo-external" class="ab-sub-secondary ab-submenu">
<li id="wp-admin-bar-wporg" class=""><a class="ab-item" tabindex="10" href="http://wordpress.org">WordPress.org</a> </li>
<li id="wp-admin-bar-documentation" class=""><a class="ab-item" tabindex="10" href="http://codex.wordpress.org">Documentation</a> </li>
<li id="wp-admin-bar-support-forums" class=""><a class="ab-item" tabindex="10" href="http://wordpress.org/support/">Support Forums</a> </li>
<li id="wp-admin-bar-feedback" class=""><a class="ab-item" tabindex="10" href="http://wordpress.org/support/forum/requests-and-feedback">Feedback</a> </li></ul></div> </li>
<li id="wp-admin-bar-site-name" class="menupop"><a class="ab-item" tabindex="10" aria-haspopup="true" href="http://pixelize.net/wp-admin/">Pixelize - Digital & Web Design Agen…</a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-site-name-default" class="ab-submenu">
<li id="wp-admin-bar-dashboard" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/">Dashboard</a> </li></ul><ul id="wp-admin-bar-appearance" class=" ab-submenu">
<li id="wp-admin-bar-themes" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/themes.php">Themes</a> </li>
<li id="wp-admin-bar-widgets" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/widgets.php">Widgets</a> </li>
<li id="wp-admin-bar-menus" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/nav-menus.php">Menus</a> </li></ul></div> </li>
<li id="wp-admin-bar-updates" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/update-core.php" title="1 Plugin Update"><span class="ab-icon"></span><span class="ab-label">1</span></a> </li>
<li id="wp-admin-bar-comments" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/edit-comments.php" title="2 comments awaiting moderation"><span class="ab-icon"></span><span id="ab-awaiting-mod" class="ab-label awaiting-mod pending-count count-2">2</span></a> </li>
<li id="wp-admin-bar-new-content" class="menupop"><a class="ab-item" tabindex="10" aria-haspopup="true" href="http://pixelize.net/wp-admin/post-new.php" title="Add New"><span class="ab-icon"></span><span class="ab-label">New</span></a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-new-content-default" class="ab-submenu">
<li id="wp-admin-bar-new-post" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/post-new.php">Post</a> </li>
<li id="wp-admin-bar-new-media" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/media-new.php">Media</a> </li>
<li id="wp-admin-bar-new-link" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/link-add.php">Link</a> </li>
<li id="wp-admin-bar-new-page" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/post-new.php?post_type=page">Page</a> </li>
<li id="wp-admin-bar-new-user" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/user-new.php">User</a> </li></ul></div> </li>
<li id="wp-admin-bar-edit" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/post.php?post=5&action=edit">Edit Page</a> </li></ul><ul id="wp-admin-bar-top-secondary" class="ab-top-secondary ab-top-menu">
<li id="wp-admin-bar-search" class=" admin-bar-search"><div class="ab-item ab-empty-item" tabindex="-1"><form action="http://pixelize.net/" method="get" id="adminbarsearch"><input class="adminbar-input" name="s" id="adminbar-search" tabindex="10" type="text" value="" maxlength="150" /><input type="submit" class="adminbar-button" value="Search"/></form></div> </li>
<li id="wp-admin-bar-my-account" class="menupop"><a class="ab-item" tabindex="10" aria-haspopup="true" href="http://pixelize.net/wp-admin/profile.php" title="My Account">Howdy, admin</a><div class="ab-sub-wrapper"><ul id="wp-admin-bar-user-actions" class=" ab-submenu">
<li id="wp-admin-bar-user-info" class=""><a class="ab-item" tabindex="-1" href="http://pixelize.net/wp-admin/profile.php"><span class='display-name'>admin</span></a> </li>
<li id="wp-admin-bar-edit-profile" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-admin/profile.php">Edit My Profile</a> </li>
<li id="wp-admin-bar-logout" class=""><a class="ab-item" tabindex="10" href="http://pixelize.net/wp-login.php?action=logout&_wpnonce=470065bb4c">Log Out</a> </li></ul></div> </li></ul> </div>
</div>
</body>
</html>
而且 - 供大家参考，这是看中箱链接：http://fancybox.net/howto
我错过了简单的东西？
您的网站可以在Firefox和Chrome浏览器中使用，但IE浏览器不支持IE浏览器......无论如何，“DOCTYPE”必须是文档的第一行（无评论或空格）才能使fancybox v1.3.x正常工作与IE – JFK 2012-03-13 21:38:14
你知道什么 - 我累了一切左右和中心 - 仍在玩，但刚回来并注意到它突然起作用，我现在不会争论它，但将解决IE问题:)谢谢:) – 2012-03-13 22:57:11
@Owen：现在它的工作原理是'nivoSlider'代码放在'fancybox'代码的上方。 'jquery.min.js'只加载一次，*在'fancybox-1.3.4.js'之前，因此不会覆盖'$ .fn.fancybox'所具有的'jQuery'的任何定义已延长。 – 2012-03-14 06:14:10