Autor | Zpráva | ||
---|---|---|---|
cink Profil |
Ahoj, mám překvapivě problém.
V rozevírací kostce (styl Windows 7 phone) mám odkaz. Když kliknu na "kostku", tak mi to tu kostku rozevře na větší. To je v pořádku. Ale když kliknu na odkaz, tak mi to nezobrazí tu stránku ale rozevře kostku na větší. http://www.htmldrive.net/items/demo/1339/-jQuery-dragging-and-dropping-plugin-Gridly- Živá ukázka, to je bez toho odkazu Popřípadě stáhnutí. Kód: <!DOCTYPE html> <html> <head> <meta charset='UTF-8'> <title>jQuery Gridly</title> <link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'> <link href='stylesheets/jquery.gridly.css' rel='stylesheet' type='text/css'> <link href='stylesheets/sample.css' rel='stylesheet' type='text/css'> <script src='https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.js' type='text/javascript'></script> <script src='javascripts/jquery.gridly.js' type='text/javascript'></script> <script src='javascripts/sample.js' type='text/javascript'></script> <script src='javascripts/rainbow.js' type='text/javascript'></script> </meta> </head> <body> <div class='content'> <h1>Example</h1> <section class='example'> <div class='gridly'> <div class='brick small'> <a class='delete' href='#'>×</a><a href="http://www.google.cz" target="_blank">ahojky</a></div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> <div class='brick small'> <a class='delete' href='#'>×</a> </div> </div> <p class='actions'> <a class='add button' href='#'>Add</a> </p> </section> </div> </body> </html> Potom CSS: https://fonts.googleapis.com/css?family=Lato]https://fonts.googleapis.com/css?family=Lato]https://fonts.googleapis.com/css?family=Lato @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: local('Lato Regular'), local('Lato-Regular'), url(https://themes.googleusercontent.com/static/fonts/lato/v6/9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff'); } stylesheets/jquery.gridly.css /* jQuery Gridly * Copyright 2013 Kevin Sylvestre * 1.1.2 */ .gridly, .gridly > :not(.dragging) { -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .gridly .dragging { z-index: 800; } stylesheets/sample.css * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body, html, p, h1, h2, h3, h4, h5, h6 { font-family: "Lato", "Helvetica", serif; font-weight: normal; } code { font-family: "Consolas", "Monaco", monospace; font-weight: normal; } body, html, p, code { color: #888888; } h1, h2, h3, h4, h5, h6 { color: #444444; } pre { overflow: scroll; background: #eeeeee; padding: 10px; } .content { width: 980px; margin: 80px auto; } .formats .format { display: inline-block; } .zip { background: url("../images/zip.png"); display: block; width: 128px; height: 128px; } .tar { background: url("../images/tar.png"); display: block; width: 128px; height: 128px; } .fork { position: absolute; top: 0; left: 0; border: 0; } .button { display: block; padding: 20px; width: 200px; color: white; background: #888888; margin: 20px 0; text-align: center; text-decoration: none; border-radius: 4px; } pre .support.tag { color: #000088; } pre .support.attribute { color: #880000; } pre .string.value { color: #008800; } .example { position: relative; } .example .brick { opacity: 1; cursor: pointer; position: relative; } .example .brick .delete { display: block; color: white; background: rgba(255, 255, 255, 0.2); width: 40px; height: 40px; top: 0; right: 0; position: absolute; text-align: center; line-height: 40px; } .example .brick.small { width: 140px; height: 140px; } .example .brick.large { width: 300px; height: 300px; } .example .brick.dragging { opacity: 0.8; } .example .brick:nth-child(20n + 1) { background: #1abc9c; } .example .brick:nth-child(20n + 2) { background: #16a085; } .example .brick:nth-child(20n + 3) { background: #2ecc71; } .example .brick:nth-child(20n + 4) { background: #27ae60; } .example .brick:nth-child(20n + 5) { background: #3498db; } .example .brick:nth-child(20n + 6) { background: #2980b9; } .example .brick:nth-child(20n + 7) { background: #9b59b6; } .example .brick:nth-child(20n + 8) { background: #8e44ad; } .example .brick:nth-child(20n + 9) { background: #34495e; } .example .brick:nth-child(20n + 10) { background: #2c3e50; } .example .brick:nth-child(20n + 11) { background: #f1c40f; } .example .brick:nth-child(20n + 12) { background: #f39c12; } .example .brick:nth-child(20n + 13) { background: #e67e22; } .example .brick:nth-child(20n + 14) { background: #d35400; } .example .brick:nth-child(20n + 15) { background: #e74c3c; } .example .brick:nth-child(20n + 16) { background: #c0392b; } .example .brick:nth-child(20n + 17) { background: #ecf0f1; } .example .brick:nth-child(20n + 18) { background: #bdc3c7; } .example .brick:nth-child(20n + 19) { background: #95a5a6; } .example .brick:nth-child(20n + 20) { background: #7f8c8d; } A Javascript: https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.js /*! * jQuery JavaScript Library v2.0.2 * http://jquery.com/ * * Includes Sizzle.js * http://sizzlejs.com/ * * Copyright 2005, 2013 jQuery Foundation, Inc. and other contributors * Released under the MIT license * http://jquery.org/license * * Date: 2013-05-30T21:25Z */ (function( window, undefined ) { // Can't do this because several apps including ASP.NET trace // the stack via arguments.caller.callee and Firefox dies if // you try to trace through "use strict" call chains. (#13335) // Support: Firefox 18+ //"use strict"; var // A central reference to the root jQuery(document) rootjQuery, // The deferred used on DOM ready readyList, // Support: IE9 // For `typeof xmlNode.method` instead of `xmlNode.method !== undefined` core_strundefined = typeof undefined, // Use the correct document accordingly with window argument (sandbox) location = window.location, document = window.document, docElem = document.documentElement, // Map over jQuery in case of overwrite _jQuery = window.jQuery, // Map over the $ in case of overwrite _$ = window.$, // [[Class]] -> type pairs class2type = {}, // List of deleted data cache ids, so we can reuse them core_deletedIds = [], core_version = "2.0.2", // Save a reference to some core methods core_concat = core_deletedIds.concat, core_push = core_deletedIds.push, core_slice = core_deletedIds.slice, core_indexOf = core_deletedIds.indexOf, core_toString = class2type.toString, core_hasOwn = class2type.hasOwnProperty, core_trim = core_version.trim, // Define a local copy of jQuery jQuery = function( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init( selector, context, rootjQuery ); }, // Used for matching numbers core_pnum = /[+-]?(?:\d*\.|)\d+(?: |
||
Časová prodleva: 11 let
|
0