Cara Membuat Tooltip Hanya dengan CSS

Inilah cara membuat tooltip di web tanpa menggunakan JQuery, cukup dengan CSS.

 
<a href="#" style="position:relative;"> Tool Tip Right <div class="tool-tip slideIn right">ini tooltip, di sini bisa nulis apa saja.</div></a><br><br>

dan ini skrip css-nya:

/* tooltip */


.tool-tip{
	color: #fff;
	background-color: rgba( 0, 0, 0, .7);
	text-shadow: none;
	font-size: .8em;
	visibility: hidden;
	-webkit-border-radius: 7px; 
	-moz-border-radius: 7px; 
	-o-border-radius: 7px; 
	border-radius: 7px;	
	text-align: center;	
	opacity: 0;
	z-index: 999;
	padding: 3px 8px;	
	position: absolute;
	cursor: default;
	-webkit-transition: all 240ms ease-in-out;
	-moz-transition: all 240ms ease-in-out;
	-ms-transition: all 240ms ease-in-out;
	-o-transition: all 240ms ease-in-out;
	transition: all 240ms ease-in-out;	
}

.tool-tip,
.tool-tip.top{
	top: auto;
	bottom: 114%;
	left: 50%;		
}

.tool-tip.top:after,
.tool-tip:after{
	position: absolute;
	bottom: -12px;
	left: 50%;
	margin-left: -7px;
	content: ' ';
	height: 0px;
	width: 0px;
	border: 6px solid transparent;
    border-top-color: rgba( 0, 0, 0, .7);	
}

/* default heights, width and margin w/o Javscript */

.tool-tip,
.tool-tip.top{
	width: 150px;
	height: 300px;
	margin-left: -43px;
}

/* tool tip position right */

.tool-tip.right{
	top: 50%;
	right: auto;
	left: 106%;
	margin-top: -15px;
	margin-right: auto;	
	margin-left: auto;
}

.tool-tip.right:after{
	left: -5px;
	top: 50%;	
	margin-top: -6px;
	bottom: auto;
	border-top-color: transparent;	
    border-right-color: rgba( 0, 0, 0, .7);	
}

/* tooltip on focus left and right */

.on-focus .tool-tip.left,
.on-focus .tool-tip.right{
	margin-top: -19px;
}

/* on hover of element containing tooltip default*/

*:not(.on-focus):hover > .tool-tip,
.on-focus input:focus + .tool-tip{
	visibility: visible;
	opacity: 1;
	-webkit-transition: all 240ms ease-in-out;
	-moz-transition: all 240ms ease-in-out;
	-ms-transition: all 240ms ease-in-out;
	-o-transition: all 240ms ease-in-out;
	transition: all 240ms ease-in-out;		
}

sumber: CssDeck

Menentukan Name Server pada ConnectionString

Saya membuat sebuah web aplikasi dengan C#.Net, ada sebuah kebutuhan untuk koneksi ke database MySQL. Berikut adalah Connection String untuk koneksi ke MySQL dari C#.Net yang saya buat:

MyConnectionString = “Server=51.151.123.123; port=3306;Database=MyDatabaseName;Uid=MyUID;Pwd=MyPwd;”;

itu bukan IP sebenarnya ya. hhehe..
Sebelumnya, web aplikasi ini saya simpan di server lokal. Dengan Connection String yang sama (Server name menggunakan IP), bisa berjalan dengan baik.

Ketika harus di-upload ke cloud, saya mengganti name server itu dengan IP Cloud. Ternyata koneksi bermasalah.

Solusinya adalah, mengganti nameserver dengan “localhost”. keseluruhan ConnectionString itu jadi:

MyConnectionString = “Server=localhost; port=3306;Database=MyDatabaseName;Uid=MyUID;Pwd=MyPwd;”;

and it works fine :)

Custom error pages and WCF exceptions in IIS, and a case of bad UI

retno:

I have this issue and so far it helps.

Originally posted on ⦃ Noam ⍤ Lewis ⦄:

Nope, nothing to do with Haskell.

This admittedly boring post is about two specific problems with IIS 7.5 and WCF which wasted so much of my time that I thought it would be worth to  document them.

If you have a WCF service hosted as an ASP.NET application in IIS, you may encounter the following exception on the client side:

System.ServiceModel.ProtocolException: The content type text/html of the response message does not match the content type of the binding (application/x-gzip). If using a custom encoder, be sure that the IsContentTypeSupported method is implemented properly. The first 75 bytes of the response were: ‘The page cannot be displayed because an internal server error has occurred.’.

—> System.Net.WebException: The remote server returned an error: (500) Internal Server Error.

at System.Net.HttpWebRequest.GetResponse()
at System.ServiceModel.Channels.HttpChannelFactory.HttpRequestChannel.HttpChannelRequest.WaitForReply(TimeSpan timeout)
— End of inner exception stack trace —

The system I’m maintaining has gzip-binary-encoded data over HTTP, so the first…

View original 743 more words

Mencari nilai suatu field dalam database di semua table

Query berikut ini berfungsi untuk mencari nilai suatu field dalam database, menggunakan “like”, dan pencariannya melingkupi seluruh table yang ada dalam database tersebut.

Misalnya kita ingin mencari nilai “Retno” dalam database “HR”, tetapi kita tidak tau table mana yang digunakan. Buka editor query baru, paste query di bawah ini, ganti “Retno” dengan nilai yang ingin dicari.

DECLARE @Results TABLE(ColumnName nvarchar(370), ColumnValue nvarchar(3630), TableName nvarchar(255))

SET NOCOUNT ON

DECLARE @TableName nvarchar(256), @ColumnName nvarchar(128), @SearchStr2 nvarchar(110)
SET  @TableName = ''
SET @SearchStr2 = QUOTENAME('%Retno%','''')

WHILE @TableName IS NOT NULL
BEGIN
    SET @ColumnName = ''
    SET @TableName = 
    (
        SELECT MIN(QUOTENAME(TABLE_SCHEMA) + '.' + QUOTENAME(TABLE_NAME))
        FROM    INFORMATION_SCHEMA.TABLES
        WHERE       TABLE_TYPE = 'BASE TABLE'
            AND QUOTENAME(TABLE_SCHEMA) + '.' + QUOTENAME(TABLE_NAME) > @TableName
            AND OBJECTPROPERTY(
                    OBJECT_ID(
                        QUOTENAME(TABLE_SCHEMA) + '.' + QUOTENAME(TABLE_NAME)
                         ), 'IsMSShipped'
                           ) = 0
    )

    WHILE (@TableName IS NOT NULL) AND (@ColumnName IS NOT NULL)
    BEGIN
        SET @ColumnName =
        (
            SELECT MIN(QUOTENAME(COLUMN_NAME))
            FROM    INFORMATION_SCHEMA.COLUMNS
            WHERE       TABLE_SCHEMA    = PARSENAME(@TableName, 2)
                AND TABLE_NAME  = PARSENAME(@TableName, 1)
                AND DATA_TYPE IN ('char', 'varchar', 'nchar', 'nvarchar')
                AND QUOTENAME(COLUMN_NAME) > @ColumnName
        )

        IF @ColumnName IS NOT NULL
        BEGIN
            INSERT INTO @Results
            EXEC
            (
                'SELECT ''' + @TableName + '.' + @ColumnName + ''', LEFT(' + @ColumnName + ', 3630), ''' + @TableName + ''' 
                FROM ' + @TableName + ' (NOLOCK) ' +
                ' WHERE ' + @ColumnName + ' LIKE ' + @SearchStr2
            )
        END
    END 
END

SELECT ColumnName, ColumnValue FROM @Results

Cara Supaya Text Bisa Diklik Di Radio Button

Ketika kita membuat radio button di web, default-nya text di sebelah radio button itu tidak bisa diklik, tidak sinkron dengan radio button-nya.

Contoh penggunaannya adalah aplikasi kuis. Cara supaya text itu berkoresponden terhadap radio button yang kita buat, gunakan skrip berikut ini:

<form>
    <p>What is my middle name?</p>
    <br>
    <input id="349" type="radio" value="1" name="question1">
    <label for="349">Abe</label>
    <br>
    <input id="350" type="radio" value="2" name="question1">
    <label for="350">Andrew</label>
    <br>
    <input id="351" type="radio" value="3" name="question1">
    <label for="351">Andre</label>
    <br>
    <input id="352" type="radio" value="4" name="question1">
    <label for="352">Anderson</label>
    <br>
</form>

sedangkan demo-nya bisa dilihat di sini.