Fancybox не работает? Могут ли быть сценарии? - PullRequest
1 голос
/ 13 марта 2012

Здравствуйте, Stackoverflowers -

Чуть запутался на этом сайте, и ищет надежный ответ в том, что я сделал неправильно?- На данный момент ссылка на этой странице не работает, а это читать дальше :

http://pixelize.net/services/

Fancybox являетсядовольно простое руководство по копированию и вставке, и я использовал его на двух других сайтах, так что я довольно знаком с ним;и, честно говоря, это не так уж сложно!Вот почему меня это спрашивает здесь, потому что я знаю, что простые вопросы, подобные этому, могут снизить качество переполнения стека, но ни один форум или другая тема не решают мою проблему;так что это мое последнее средство.

Я заглянул на сайт, используя firebug, и когда я смотрю на сценарий, он снова загружает мою текущую страницу в сценарии, а не в документ 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 &amp; Web Design Agency &raquo; Feed" href="http://pixelize.net/feed/" />
<link rel="alternate" type="application/rss+xml" title="Pixelize  - Digital &amp; Web Design Agency &raquo; 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&amp;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 &amp; Web Design Agen&hellip;</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&#038;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&#038;_wpnonce=470065bb4c">Log Out</a>       </li></ul></div>        </li></ul>          </div>
        </div>

        </body>
</html>

Также - для вашей справки это ссылка для причудливого бокса: http://fancybox.net/howto

Я что-то упустил?Заранее благодарю ..

Ответы [ 2 ]

4 голосов
/ 13 марта 2012

В вашем nivoSlider вы добавляете еще одну ссылку на скрипт в jQuery, которая перезаписывает объект jQuery, так что jQuery.fancybox больше не существует.

Удалите следующий блок скрипта из кода nivoSlider:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
1 голос
/ 13 марта 2012

Вам не хватает открывающего тега <head>. Первое, что нужно исправить и попробовать!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...