Author Archive
Boost your website performance with “Page Speed” tool.
Page Speed is a family of tools for optimizing the performance of web pages.
The Page Speed browser extensions, available for Chrome and Firefox, allow you to evaluate the performance of your web pages and to get suggestions on how to improve them.
Page Speed Tool Download
How to Show hide content using core JavaScript ?
Today I was working on another website and had very long text/content and thought to use Jquery, there are several examples given on internet. I tried to use some of them of course they are very simple but because of some reason it didn’t work for me either in IE and chrome.
So decided to compile my own show hide JavaScript which is based on DOM!
Here is very simple code and it works everywhere, Firefox, Internet Explorer, Chrome, Safari etc.
Steps are self explanatory.
A. Use JavaScript code
B. Use Css Class
C. See the example and compile your own!
<script language="javascript" type="text/javascript">
function PM_show_Hide(pmID) {
if (document.getElementById(pmID)) {
if (document.getElementById(pmID+'-show').style.display != 'none') {
document.getElementById(pmID+'-show').style.display = 'none';
document.getElementById(pmID).style.display = 'block';
}
else {
document.getElementById(pmID+'-show').style.display = 'inline';
document.getElementById(pmID).style.display = 'none';
}
}
}
</script>
<style type="text/css">
.more-pm {
display: none;
</style> |
<p>This is first paragraph of my big content.
<a href="#" id="PM-show" class="showLink" onclick="PM_show_Hide('PM');return false;">Click to See more.</a> <p>
<div id="PM" class="more-PM">
<p>Here is your hidden text which you want to hide!! Copy your text here!</p>
<p><a href="#" id="PM-hide" class="hideLink" onclick="PM_show_Hide('PM');return false;">Click to hide this content.</a></p>
</div> |
How to upgrade Drupal ?
Drupal is always releasing security updates every now and then.
PHP communality called it patches!
So here are the steps you can use to patch your Drupal and lock down security hole in Drupal web application.
1. Download latest release of Drupal package from Drupal site.
2. Put your PHP Drupal site in maintenance mode (offline)
3. Take a database backup/export using any MYSQL tools, like phpmyadmin (I use it in MAMP environment ). Same thing you can do by command line if you want to do so.
(mysql –u ROOT –p YOURPASSWORD yourdatabasename > exporteddbname.sql)
4. Make backup of your Drupal application folder.
5. Now it is time to copy all files – untar or unzip your downloaded new Drupal patch package.
6. Copy all files and folders Except “Site folder”, “.htaccess” file and “robot.txt”, you can have custom configuration and setting to these files and folder so it is good not to overwrite these files and folder.
7. Run CRON in your Drupal application.
8. Run update.php it will detect automatically type of database and schema you are using and update it. It takes few seconds, so please don’t halt upgrading process.
http://localhost/drupal/update.php
9. If above process is successful, put back your site in (Online mode) live mode.
10. See status report and you will notice your Drupal is updated.
Your Drupal application is safe now !
What is difference between setInterval () and setTimeout () ?
setTimeout execute javascript statement AFTER x interval.
For example – setTimeout(“execute_something();”, 2000);
This is execute function execute_something() after 2 seconds.
setInterval execute javascript statement EVERY x interval.
For example – setInterval(“execute_something();”, 2000);
This is execute function execute_something() in every 2 seconds.
How to use Firebug within Google Chrome?
Google Chrome does not support plug-ins, there is Firebug-like too already available built within Google Chrome. That is called “Inspect element” just right click on page anywhere and click on “Inspect element” menu command. It will open a new panel like firebug. It works well for CSS debugging and you can change CSS in real time like firebug but JavaScript debugging is not very good supported.
How to change date formate of twitter field “created_at”?
php coder who is reading twitter API for latest tweets want to change date/ timestamp format which is returned by ‘created_at’ key. Most of the times I use JSON based request. e. i. http://search.twitter.com/search.json?q=phpmind
These are the fields returned by above request.
Hope fully you understand how json string looks like.
Now it is time to convert date time stamp in more readable format.
Please change the date parameters if you want to play with different date formats.
If you want to use javaScript way to format dates here is very cool function.
Returned by twitter – Wed, 09 Feb 2011 02:44:36 +0000
Returned by this javaScript function, TwitterDateConverter ($object->returns[0]->created_at);
Output will be for Example “14 minutes ago”
See Image Below!
<script type="text/JavaScript">
function TwitterDateConverter(time){
var date = new Date(time),
diff = (((new Date()).getTime() - date.getTime()) / 1000),
day_diff = Math.floor(diff / 86400);
if ( isNaN(day_diff) || day_diff < 0 || day_diff >= 31 )
return;
return day_diff == 0 && (
diff < 60 && "just now" ||
diff < 120 && "1 minute ago" ||
diff < 3600 && Math.floor( diff / 60 ) + " minutes ago" ||
diff < 7200 && "1 hour ago" ||
diff < 86400 && Math.floor( diff / 3600 ) + " hours ago") ||
day_diff == 1 && "Yesterday" ||
day_diff < 7 && day_diff + " days ago" ||
day_diff < 31 && Math.ceil( day_diff / 7 ) + " weeks ago";
}
</script> |
How to auto refresh a page through JavaScript?
Here is the small JavaScript example that tells how you can use setTimeout() to auto refresh page content. You can utilize this script in games site or stock sites or anywhere you can think of.
<html>
<head>
<script type="text/JavaScript">
<!--
function AutoRefresh(interval) {
setTimeout("location.reload(true);",interval);
}
// -->
</script>
<title>PHPMIND – Javascript Tutorials</title></head>
<body onload="JavaScript: AutoRefresh(6000);">
<h2>JavaScript Auto Refresh Page</h2>
<p>This code will refresh you page in 6 seconds. We have used OnLoad() Event function to call our function.
Note : Please don’t use a lot of auto refresh page because it is kind of annoying and your sever bandwidth will be decreasing, one way you are increasing hits to server.
</body>
</html> |
