Archive | Engelske guides RSS feed for this section
AJAX User Poll Using jQuery and PHP
Today, we’ll be creating a nice user poll script using jQuery and PHP utilizing AJAX and animation effects of jQuery to spice up the user interface and provide a rich user experience. Let’s get started. Set up the database For storing poll questions, options and votes, we’ll be using a MySQL database. Here is the database structure [...]
Continue reading...Quick and Easy Way to Implement Drag n Share With jQuery
13. februar 2010
Kommentarer slået fra
You must have seen the drag to share functionality on Mashable that lets visitors share the content on popular social networks intuitively. Just drag one of the images in an article and you’ll be able to share the article on your favorite social network by dropping the dragged image over its icon. Even, Nettuts has [...]
Continue reading...Shuffle DOM Elements
13. februar 2010
Kommentarer slået fra
Plugin (function($){ $.fn.shuffle = function() { var allElems = this.get(), getRandom = function(max) { return Math.floor(Math.random() * max); }, shuffled = $.map(allElems, function(){ var random = getRandom(allElems.length), randEl = $(allElems[random]).clone(true)[0]; allElems.splice(random, 1); return randEl; }); this.each(function(i){ $(this).replaceWith($(shuffled[i])); }); return $(shuffled); }; })(jQuery); Usage Target elements, call shuffle. $('ul#list li').shuffle(); Link til artiklen (Læse tid 12 sek) Tags: CSS, GET, IP, [...]
Continue reading...Scroll Page Horizontally With Mouse Wheel
13. februar 2010
Kommentarer slået fra
1) Load jQuery and the Mouse Wheel plugin Mouse Wheel plugin is here. <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?ver=1.3.2'></script> <script type='text/javascript' src='/js/jquery.mousewheel.min.js'></script> 2) Attach mousewheel event to body The “30″ represents speed. preventDefault ensures the page won’t scroll down. $(function() { $("body").mousewheel(function(event, delta) { this.scrollLeft -= (delta * 30); event.preventDefault(); }); }); Link til artiklen (Læse tid 12 sek) Tags: AJAX, CSS, GET, IP, Java, [...]
Continue reading...Call Function with Random Timer
13. februar 2010
Kommentarer slået fra
function randRange(data) { var newTime = data[Math.floor(data.length * Math.random())]; return newTime; } function toggleSomething() { var timeArray = new Array(200, 300, 150, 250, 2000, 3000, 1000, 1500); // do stuff, happens to use jQuery here (nothing else does) $("#box").toggleClass("visible"); clearInterval(timer); timer = setInterval(toggleSomething, randRange(timeArray)); } var timer = setInterval(toggleSomething, 1000); // 1000 = Initial timer when the page [...]
Continue reading...JavaScript Required Content with Fallback Content
13. februar 2010
Kommentarer slået fra
JavaScript-required area is hidden with inline CSS, and then shown after it loads with a small snippet of JavaScript. Below that, noscript tags are used for fallback content. So only one or the other of these bits of content will be required depending on if JavaScript is enabled or not. <!-- JavaScript-Required Content --> <div id="photoslider" style="display:none">Javascript [...]
Continue reading...Current Page with JavaScript
13. februar 2010
Kommentarer slået fra
This is like a replacement for PHP’s SCRIPT_NAME with JavaScript. location.href.split('/').pop(); For example with this URL: http://css-tricks.com/examples/ScriptName/index.php This code: document.write( location.href.split('/').pop() ); Would write to the page: “index.php” Link til artiklen (Læse tid 7 sek) Tags: CSS, IP, Java, JavaScript, php, script, URL
Continue reading...Use PHP inside JavaScript
13. februar 2010
Kommentarer slået fra
This has only really been tested on Media Temple (gs) servers. In the folder with the JavaScript, the .htaccess file should include: <FilesMatch "^.*?api.*?$"> SetHandler php5-script </FilesMatch> In that above example, any file that includes the string “api” will be processed as PHP. Feel free to alter that RegEx. Then in the JavaScript file itself, set the ContentType back to JavaScript: <?php [...]
Continue reading...Get URL and URL Parts in JavaScript
13. februar 2010
Kommentarer slået fra
JavaScript can access the current URL in parts. For this URL: http://css-tricks.com/example/index.html window.location.protocol = “http” window.location.host = “css-tricks.com” window.location.pathname = “example/index.html” So to get the full URL path in JavaScript: var newURL = window.location.protocol + "://" + window.location.host + "/" + window.location.pathname; If you need to breath up the pathname, for example a URL like http://css-tricks.com/blah/blah/blah/index.html, you can split the string on [...]
Continue reading...Animate Panning Slideshow with jQuery
13. februar 2010
Kommentarer slået fra
If there’s one thing that never seems to go out of style, it’s a good jQuery slideshow. Highly visual websites rely on the ability to showcase imagery automatically. Whether it be a professional photographer or zoo, slideshows pop up so frequently because they work well. In today’s tutorial we’ll take the makings of a classic slideshow, but [...]
Continue reading...
13. februar 2010
Kommentarer slået fra