Thursday, July 5, 2018

jQuery- show div on hover - hide div on mouseout

Here you are


HTML


<a href="#" class="mark">hover anchor</a>
<div class="icontent">
  <p>
    lorem ipsum dolor sit amet......
  </p>
</div>  


JS

(function(){
  var del = 200;
  $('.icontent').hide().prev('a').hover(function(){
    $(this).next('.icontent').stop('fx', true).slideToggle(del);
  });
})();

Wednesday, July 4, 2018

jQuery- jQuery click event not working after adding class

Since the class is added dynamically, you need to use event delegation to register the event handler

$(document).on('click', "a.tabclick", function() {
   alert('COMES');   
});

Wednesday, June 27, 2018

jQuery: Opening Youtube video, after clicking a custom button

HTML:

<video class="vid" autoplay loop>
    <source src="video.mp4" type='video/mp4' />
    <img id="alternative" src="alternative.jpg" />
</video>
<iframe class="vid" id="yt" src="https://www.youtube.com/embed/qObSFfdfe7I" frameborder="0" allowfullscreen></iframe>
<div id="content">
    <p>Title</p>
    <center>
        <button>Click</button>
    </center>
</div>

jQuery:

$("button").click(function () {
    $("#content").hide();
    $("#yt")[0].src += "?autoplay=1";
    setTimeout(function(){ $("#yt").show(); }, 200);
    });





jQuery- Stop YouTube video within iFrame on external Button click

//First get the  iframe URL
var url = jQuery('#YourIFrameID').attr('src');

//Then assign the src to null, this then stops the video been playing
jQuery('#YourIFrameID').attr('src', '');

// Finally you reasign the URL back to your iframe, so when you hide and load it again you still have the link
jQuery('#YourIFrameID').attr('src', url);

Tuesday, June 19, 2018

CSS- Creating full width (100% ) container inside fixed width container.

Some times we need to add a full width containers (which spans 100% of window) inside a container which has a fixed width and aligned center.
Like below screenshot.

HTML

 <div class="container" style="width: 750px; margin: 0 auto;">
    <p>
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
    </p>
<div class="row-full">
     --- Full width container ---
</div>

 <p>
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
    </p>

</div>

CSS

<style>
 .row-full{
 width: 100vw;
 position: relative;
 margin-left: -50vw;
 height: 100px;
 left: 50%;
 background-color:red;
}
</style>

Friday, June 8, 2018

SSH- List of Basic SSH Commands

SSH CommandExplanation
lsShow directory contents (list the names of files).
cdChange Directory.
mkdirCreate a new folder (directory).
touchCreate a new file.
rmRemove a file.
catShow contents of a file.
pwdShow current directory (full path to where you are right now).
cpCopy file/folder.
mvMove file/folder.
grepSearch for a specific phrase in file/lines.
findSearch files and directories.
vi/nanoText editors.
historyShow last 50 used commands.
clearClear the terminal screen.
tarCreate & Unpack compressed archives.
wgetDownload files from the internet.
duGet file size.

Wednesday, December 13, 2017

SSH- How to zip a folder via SSH Terminal

This is how you can zip a folder via SSH on your Linux server. Works on Debian and other servers.

zip -r filename.zip foldername/

Tuesday, November 14, 2017

Sunday, November 12, 2017

SSH- Change all files and folders permissions of a directory to 644/755

SSH- Change all files and folders permissions of a directory to 644/755
 
   
find * -type d -print0 | xargs -0 chmod 0755 # for directories
find . -type f -print0 | xargs -0 chmod 0644 # for files



For WordPress -


All files should be 664.
All folders should be 775.
wp-config.php should be 660.
    

Monday, October 30, 2017

SSH- How to create php files in /var/www folder?

SSH- How to create php files in /var/www folder?


-Create the file

sudo touch hello.php

-Open the file

sudo vi hello.php

Enter write mode (we were in command mode initially) by pressing  a  (note that    vi   is case sensitive)

After that, press Esc (to change to command mode) and type :wq Check if everything is fine with
cat hello.php

However, it's probably a better idea to use editors such as vim or nano as work with them is a lot simpler than that.