Latest Post
Tampilkan postingan dengan label html. Tampilkan semua postingan
Tampilkan postingan dengan label html. Tampilkan semua postingan

Concatenate html tags to string in php

Written By Unknown on Selasa, 29 Oktober 2013 | 23.07

To add html tags to string in php ... You have to concatenate html tags with string using htmlentities()
as shown below
$newstring="<u>".htmlentities("test")."</u>";
Here i have added <u> tag to my string test which is passed to htmlentities() function for concatenation.

For more details see the example
Example:

<?php
$mystring="Hello ... This is my test string . I am testing it for htmlentities()";
echo "This is string before adding html tags"."</br>";
echo "</br>";
echo $mystring;
echo "</br>";
echo "</br>";
$newstring="<u>".htmlentities("test")."</u>";
$finalstring=str_replace("test",$newstring,$mystring);
echo "This is string after add html tags"."</br>";
echo "</br>";
echo $finalstring;
?>


htmlentities

Append some (text/img) after some html element using jquery

Written By Unknown on Jumat, 13 September 2013 | 04.56

How to append some (text/img) after some html element using jquery 

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script type="text/javascript" >
        $(document).ready(function(){
var i=0;
            $("#sub").on("click",function(){
$( "#1" ).append("Test "+i+" ... ");
                 i++;
                 });      
            });
 
        </script>
        </head>
    <body>
<div id="1">This is my test...</div>
<button type="button"  id="sub">Append</button>
</form>
</body>

</html>

Join us ...

Written By Unknown on Senin, 09 September 2013 | 22.24

How to write your first php script ?

Written By Unknown on Selasa, 20 Agustus 2013 | 23.08

What you need ?

1. A server
2. A php file to be put in your www. or htdocs directory..

Phpfile

<?php

echo "My first PHP script!";
 

?>

Cleaver - Slideshows with HTML, JSON and jQuery

Written By Unknown on Selasa, 20 November 2012 | 09.23

A command-line tool for generating HTML slideshows with JSON.Cleaver is a one-stop shop for generating HTML presentations in record time. Using only an intuitive JSON format, you can produce good-looking, interactive presentations without writing any code or placing a measly textbox.Cleaver produces a single document, output.html containg CSS and JavaScript (jQuery) code.


For Demo Click Here

To download files Click Here

Audio-Gallery-Suite (A complete audio gallery solution made with HTML5/CSS3/jQuery-JS/C#)

Written By Unknown on Minggu, 26 Agustus 2012 | 10.06

Audio-Gallery-Suite is a complete audio gallery suite/solution that includes a web audio gallery and a software for managing playlists, uploading audios and managing the web audio gallery. The Audio-Gallery-Suite is built up using the latest technology and harnesses their power to put up a sophisticated solution.
 
The Audio-Gallery-Suite is made in a way to be easily setup and deployed by anyone who wishes to use it. I hope that this project proves useful for anyone who intends to use it.
 
Audio-Gallery-Suite is a complete audio gallery solution made with HTML5/CSS3/Jquery-JS/PHP-ajax/C# that includes a web audio gallery and a software for managing the web audio gallery.

To read more about this article Click Here

For Demo Click Here

jqmPhp : HTML Code Generator for jQuery Mobile Framework

Written By Unknown on Minggu, 24 Juni 2012 | 08.21

jqmPhp is a package of PHP classes that facilitates the creation HTML files for use with jQuery Mobile Framework. All classes in the jqmPhp package can be converted to string and printed with an echo function.


To read more about this article Click Here

For Demo Click Here



 

Build A Real-Time Commenting System in PHP, Ajax, jQuery, HTML5

Written By Unknown on Minggu, 17 Juni 2012 | 09.46

The Web has become increasingly interactive over the years. This trend is set to continue with the next generation of applications driven by the real-time Web. Adding real-time functionality to an application can result in a more interactive and engaging user experience.


In this tutorial, I’ll show how to convert a basic blog commenting system into a real-time engaging experience where you’ll see a comment made in one browser window “magically” appear in a second window.

To read more about this article Click Here

For demo Click Here


 

ezEditTable – Enhance Html Tables in jQuery

Written By Unknown on Jumat, 08 Juni 2012 | 08.42

ezEditTable 2.0 is a javascript code aimed at enhancing regular HTML tables by adding features such as inline editing components, advanced selection and keyboard navigation. With just a line of code you can easily convert a regular HTML table in an advanced editable and selectable grid control.


To read more about this article Click Here

For Demo Click Here



 

Create an online radio using jQuery and jPlayer

Written By Unknown on Selasa, 15 Mei 2012 | 08.49

Today, I’m glad to show you how you can use jQuery and the jPlayer plugin to build an online radio using JavaScript, PHP and a MySQL database.


To read more about this article Click Here




Mini HTML vCard : HTML jQuery Portfolio Template with Demo

Written By Unknown on Rabu, 11 April 2012 | 09.30

Mini HTML vCard is a free HTML jQuery vCard portfolio template.It is a single-page, mini websitethat is powered with JavaScript (jQuery) and focuses on quickly displaying information about a person.

The template is completely static except the contact form which requires PHP to function.

If you would like the contact form messages being e-mailed to you with SMTP authentication, there is a “mail.config” file in the root folder to setup those details.


To read more about this article Click Here

For Demo Click Here



From MySQL to HTML with PHP and XML

Written By Unknown on Rabu, 25 Mei 2011 | 10.46


In my post From MySQL to XML with PHP, I described how to generate XML from the MySQL database. Instead of printing out XML, generated XML can be buffered and transformed with XSL to the HTML. Maybe it sounds complicated for a simple process of displaying MySQL data on the WEB page. But if you set a WEB architecture this way, you will have a separated presentation layer from the database and business logic.



Here is example of final PHP source. You can see how it looks simple and clean. If you compare this code with PHP source from the previous post, you can notice two lines more: ob_start and bottom xsl.php include. ob_start starts output buffering while xsl.php uses this buffer and performs XSL transformation.



<? include('sql2xml.php') ?>
<? ob_start() ?>
<DOCUMENT>
    <? sql2xml('select a.alb_id, a.alb_name,
                                         s.sng_number, s.sng_name
                            from album a, song s
                            where a.alb_id = s.alb_id and   s.sng_number < 3
                            order by a.alb_id, s.sng_number', '2') ?>
</DOCUMENT>
<? include('xsl.php') ?>


Save file as test1.php and if you run it from the command line php test1.php, you should get the following HTML table:



<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <body>
    <table border="1">
      <tr><td colspan="2">Nevermind</td></tr>
      <tr><td>1</td><td>Breed</td></tr>
      <tr><td>2</td><td>Come As You Are</td></tr>
      <tr><td colspan="2">Band of Gypsys</td></tr>
      <tr><td>1</td><td>Who Knows</td></tr>
      <tr><td>2</td><td>Machine Gun</td></tr>
    </table>
  </body>
</html>


XSL transformation needs XML and XSL file. If you want to know how XML looks, please open From MySQL to XML with PHP post. Here is the XSL file that is used to transform generated XML. Please name it test1.xsl. It's important to have the same name as PHP file (except suffix), otherwise XSL file will not be found.



<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" doctype-public="-//W3C//DTD HTML 4.01//EN"
            doctype-system="http://www.w3.org/TR/html4/strict.dtd" />

  <xsl:template match="DOCUMENT"><!-- main template -->
    <html>
    <body>
            <table border="1"><xsl:apply-templates select="ROW0"/></table><!-- album loop -->
    </body>
    </html>
  </xsl:template>

  <xsl:template match="ROW0"><!-- album template -->
      <tr><td colspan="2"><xsl:value-of select="ALB_NAME"/></td></tr>
      <xsl:apply-templates select="ROW1"/><!-- song loop -->
  </xsl:template>

  <xsl:template match="ROW1"><!-- song template -->
      <tr>
          <td><xsl:value-of select="SNG_NUMBER"/></td>
          <td><xsl:value-of select="SNG_NAME"/></td>
      </tr>
  </xsl:template>
</xsl:stylesheet>

Before you run php test1.php, make sure you have installed php-xml package or you will get XsltProcessor not founderror. To install php-xml package with the yum utility, run the following command:

yum install php-xml


After getting current buffer contents (XML), and preparing XSL file name, script will begin the XSL transformation and generate the final HTML. Before printing, HTML can be stored to the cache - APC. Next time, instead of database, HTML can be fetched from the cache and this is very fast!



<?
// get current buffer contents and delete current output buffer
$xml_data = ob_get_clean(); 

// define xsl file name from the script itself
$_name    = explode('.', basename($_SERVER['SCRIPT_NAME']));
$xsl_file = current($_name) . '.xsl';

// create XSLT processor
$xp = new XsltProcessor();
// load the xml document and the xsl template
$xml = new DomDocument;
$xsl = new DomDocument;
$xml->loadXML($xml_data);
$xsl->load($xsl_file);

// load the xsl template
$xp->importStyleSheet($xsl);

// do XSL transformation and print result
print($xp->transformToXML($xml));
?>



13 tips for better HTML emails

Written By Unknown on Minggu, 02 Januari 2011 | 22.37


Designing and sending HTML newsletters can be a little tacky sometimes. The output of HTML in email apps is still much more limited than in web browsers, which means that you have to adapt the way you are designing your email templates. Following are a few tips to improve the HTML of your newsletters.

1. Use inline CSS styles

Unfortunatly you’ll have to forget about external style for email template design. The best solution is to declare the CSS in your HTML tags like that: <p style=”color:#000;”>. If you declare your CSS in your header, Gmail will not read it which you do not want.

2. Limit the width of your template

When creating a template for your email campaigns, don’t forget that many of your subscribers will read it in an online email app like Gmail or Hotmail. Most email software will have a sidebar that takes away some space, so it would be safe to have a template that doesn’t overpass 600px wide.

3. Avoid using too many images

Most of the time email apps will block images unless the user allows them, so you should not rely too much on images for your email understanding or the readers will just see an empty (or almost) email.

4. Offer a link that lets the subscribers unsubscribe

This is just good manners, don’t force your newsletter subscribers to stay subscribed if they don’t want to. What would you think if sales people locked the door behind you when you enter a shop?

5. Let your subscribers access the web version of the email

This gives you a way to offer a well layed-out version of your email to readers who can’t read it in their email app.

6. Don’t use flash

Most email clients will not read flash objects, so it’s not a very good idea to include it. Sometimes it will even give you security alerts.

7. Suggest to your readers to add you to their contact list

By doing this, you’re inviting your subscribers to create a closer relationship, but you also avoid getting your email ending up in the spam folder and get a better chance to have your images displayed.

8. Don’t use forms in your emails

It will not work in most email readers, just link to a form on the web.

9. Add the dimensions to images

Adding dimensions will help by showing a placeholder when images are not displayed, which will help for not breaking your layout even when images are not shown.

10. Provide an alternate text to all your images

If the images are not shown, let the users know what they are missing.

11. Don’t use PNGs with alpha transparency

Some email apps will not display PNG transparency, Lotus Notes 6 and 7 will not even display PNGs at all, so why bother? I’m afraid that you’ll have to wait that email apps evolve.

12. Don’t use CSS images

CSS background images (example: background:url(image.jpg);) will not display in many email programs, so try to avoid them.

13. Have a text-only version of your email

For the readers who can’t access your HTML email, make sure they can read it by providing a text-only version of the newsletter.

Build HTML Tables From MySQL Tables with PHP

Written By Unknown on Jumat, 17 Desember 2010 | 22.00

I was recently completing a project which required that I build a series of HTML tables which would represent all of the tables within a MySQL database.  I didn't have anything created but after a few minutes I had exactly what I needed. Hopefully this helps you out!




The CSS


table.db-table     { border-right:1px solid #ccc; border-bottom:1px solid #ccc; }
table.db-table th  { background:#eee; padding:5px; border-left:1px solid #ccc; border-top:1px solid #ccc; }
table.db-table td  { padding:5px; border-left:1px solid #ccc; border-top:1px solid #ccc; }

The CSS I'm styling the table with is as basic as it gets — style as you wish!

The PHP / MySQL


/* connect to the db */ 

$connection = mysql_connect('localhost','username','password');

mysql_select_db('my_db',$connection);


/* show tables */ 

$result = mysql_query('SHOW TABLES',$connection) or die('cannot show tables');

while($tableName = mysql_fetch_row($result)) { 



$table = $tableName[0];



echo '<h3>',$table,'</h3>';

$result2 = mysql_query('SHOW COLUMNS FROM '.$table) or die('cannot show columns from '.$table);

if(mysql_num_rows($result2)) { 

  echo '<table cellpadding="0" cellspacing="0" class="db-table">';

  echo '<tr><th>Field</th><th>Type</th><th>Null</th><th>Key</th><th>Default<th>Extra</th></tr>';

  while($row2 = mysql_fetch_row($result2)) { 

    echo '<tr>';

    foreach($row2 as $key=>$value) { 

      echo '<td>',$value,'</td>';

    } 

    echo '</tr>';

  } 

  echo '</table><br />';


}


The first step in the process is accessing all of the tables within the database.  Once all tables have been fetched, the next step is to loops through the array of tables we receive and, for each table, build a new HTML table with column information.


othing groundbreaking but surely has use.  I've also written a blog post about backing up your MySQL database with PHP titled Backup Your MySQL Database Using PHP; check that out if you'd prefer to backup your databse information in SQL format!

Browser Compatible Info for HTML and CSS

Written By Unknown on Senin, 14 Juni 2010 | 03.50

CSS and HTML is used to design a website to look attractive. However, the development of CSS and HTML, and every browser that is not balanced to make the UI developers need to ensure that information can be seen very well in every browser.
Browser becomes a very important media for conveying information in the Internet world. And appearance to be a very important step to ensure the information presented is easy and convenient to read.
This article has been collecting a variety of info about compatible browsers for CSS and HTML. And you can see anywhere a compatible browser to websites that are created in your

Free The Foxes

Free The Foxes is a free JavaScript+HTML+CSS-based solution solutions to inform the browser that is not compatible to visitors. With kemapuan owned FreeTheFoxes allows to assess the browser version and display the results window notification in accordance with these ratings. The window also displays the information or advice to download the better browser with a download link
 

Html5Demos


Html5Demos.com is a website that is sharing a list of HTML5 demos. Demo is in the show include HTML5 features such as video, audio, Geolocation, drop drag’n, canvas web storage and more. Also mentioned compatible browser for each demo.
 

Modernizr

Modernizr is a JavaScript library that have the ability to detect whether a browser capable of CSS3 and HTML5 features like animation css, border radius, CSS and other transitions. The developers also can use the library to do the testing and ensure the application contains or HTML5 CSS3 to run in a browser that desired

FindMeByIP

FindMeByIP.com share information about  browser compatibility for CSS3 and HTML5 with a beautiful view and complete. In addition you can also see the famous search engine compatibility are like Google,  Yahoo and Bing
 

quirksmode

Quirksmode table lists the compatibility of CSS and HTML in general. Yes here does not mean browsers support every little detail of the specification correctly. Instead, it means that supports a subset of the specification can be implemented. In IE’s case this may mean that he supports the methods and property ownership, and properties generally equivalent to the W3C spec. Suitable for application as a reference in the UI developers working on the project website.

Read HTML files using PHP

Written By Unknown on Minggu, 09 Mei 2010 | 22.34



Reading an html file is just like reading any other file. You could use fopen() combined with fread() orfile_get_contents() or file() function. Here are some examples :

1. Using fopen() and fread()


$myFile = 'myhtmlfile.html';

// make sure the file is successfully opened before doing anything else
if ($fp = fopen($myFile, 'r')) {
   $content = '';
   // keep reading until there's nothing left 
   while ($line = fread($fp, 1024)) {
      $content .= $line;
   }

   // do something with the content here
   // ... 
} else {
   // an error occured when trying to open the specified file 
   // do something here ... ?
}


2. Using file_get_contents()


$myFile = 'yourHtmlFile.htm';
$content = file_get_contents($myFile); 
if ($content !== false) {
   // do something with the content
} else {
   // an error happened
}


3. Using file()

Note that these function is different from the other two. This one will read the file and return an array containing each line from that file. It's very useful when you want to process a file one line at a time


$myFile = 'yourHtmlFile.htm';

$content = file($myFile);

// how many lines in this file
$numLines = count($content);

// process each line
for ($i = 0; $i < $numLines; $i++) {
   // use trim to remove the carriage return and/or line feed character 
   // at the end of line 
   $line = trim($content[$i])

   // do something with $line here ...
}



The story will be different when this html file is located somewhere over the internet instead of on your own computer. If this is your case then you will need to read this : reading remote file using php

Display random number in random way using JavaScript

Written By Unknown on Selasa, 04 Mei 2010 | 01.33

I think you guys already know about how to get the random number using JavaScript, if you don’t know then you can use Math.random() to display a random no ranging from 0 to 1. It would have been better if we display the random number in the random way using JavaScript. Ok, Let’s do it..



Displaying random number in the random way
To display random number in the random way, what we need is get the random number and write the random in a certain interval.
HTML Code :
<div id='random'>0.00</div>
<input name="button" type="button" value="Click Me" onClick="randValue(40,5)" />

As you can see above, the “div” with id “random” gets updated within specified interval and when button is clicked it call the JavaScript function “randValue()”. The first parameter is the maximum of the random number and second parameter specifies how many times the action should be repeated to show the final random number.
JavaScript Code :
<script>
var i=1; //counter
function randValue(maxVal,no_of_time)
{
  i++; //counter increment
  document.getElementById('random').innerHTML=''; //element made blank
  //get a random no upto maxVal and round it to two decimal place
  var theNumber = (Math.random()*parseInt(maxVal)).toFixed(2);
  //put the number to that
  document.getElementById('random').innerHTML=theNumber; //gett
  if(i<=no_of_time)
    setTimeout("randvalue("+maxVal+","+no_of_time+")",300);
  else
    i=1;
}
</script>

As you can see in the first line, counter is set to 1. In the first line of the function, counter is incremented. And then, the content of the “div” is made blank.
var theNumber = (Math.random()*parseInt(maxVal)).toFixed(2);

As you can in this line, the random no is multiplied with the supplied argument to get the random number between zero to maxVal since Math.random() only returns the random number between 0 to 1. And, “toFixed(2)” expression rounds the number to two decimal places. And that number is placed in the “div”.And then “setTimeout()” calls the same function in every 300 millisecond until the counter reaches to “no_of_time”. And, finally the counter is set to 1 to iterate through the same action.
 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Kumpulan Kata Broadcast Blackberry - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger