JQUERY EVENTS by BCS https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez Events in jquery en-us 2017-06-01 15:30:14 UTC 2017-06-06 09:07:52 UTC hello@padlet.com Luke Exercise 1 https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174947790 <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
    <link rel="stylesheet" type="text/css" href="Exercise3.css">
</head>

<body>

    <div>
        Name:<br>
        <input type="text" name="firstname">
        <button type="button">Submit</button>
    </div>
    <table id="nameTable">
        <TR>
            <TD class=capital>Jason</TD>
            <TD class=capital>Bourne</TD>
        </TR>
        <TR>
            <TD class=capital>Michael</TD>
            <TD class=capital> Jordan</TD>
        </TR>
        <TR>
            <TD class=capital>Peter</TD>
            <TD class=capital>Parker</TD>
        </TR>
    </table>




    <script>
        $("button").click(function() {
            var splitting = $('input').val().split(' ');
            var firstName = splitting.shift();
            var secondName = splitting.join();
            var initial = secondName.substring(0, 1) + ".";
                        
            $("#nameTable").append("<tr><td>" + firstName + "</td><td>" + initial + "<tr>").addClass("capital")
            
            $("tr").children().last().mouseenter(function(event){
                $(event.target).addClass("capital").text(secondName)
                console.log(event.target)
            })
            
            $("tr").children().last().mouseout(function(event){
                $(event.target).addClass("capital").text(initial)
            })


        });  
    </script>

    

</body>

</html>


]]> 2017-06-02 09:25:18 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174947790 Gosia Ex.2 gosiapietron https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174977525 <!DOCTYPE html>



<html>



<head>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>



<title></title>



</head>



<body>



<div>

<input id='x' type="text" name="name"><button id='a'>Submit</button>

<table id='c'>

</table>

</div>



<script type="text/javascript">



$('#a').on("click", function(){

var name = $('#x').val() 



var z= name.split(" ")

var d= z[1].slice(0,1)+"."



$('#c').append('<tr><td>'+z[0]+'</td><td>'+d+'</td></tr>')





$( "tr" ).children().last().mouseenter(

function() {

$(event.target).text(z[1])}

)

$( "tr" ).children().last().mouseleave(

function() {

$(event.target).text((z[1].slice(0,1)+"."))}

)



})


</script> 



</body>



</html>

]]> 2017-06-02 13:36:33 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174977525 Gosia Ex 1. gosiapietron https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174977635 <!DOCTYPE html>



<html>



<head>



<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>



<title></title>



</head>



<body>



<div>

<input id='x' type="text" name="name"><button id='a'>Submit</button>

<table id='c'>

<tr>

<td>Jason</td>

<td>Bourne</td>

</tr>

<tr>

<td>Michael</td>

<td>Jordan</td>

</tr>

<tr>

<td>Peter</td>

<td>Parker</td>

<tr>

</table>

</div>



<script type="text/javascript">



$('#a').on("click", function(){

var name = $('#x').val() 



var z= name.split(" ") 



$('#c').append('<tr><td>'+z[0]+'</td><td>'+z[1]+'</td></tr>')



})
</script> 



</body>



</html>













]]> 2017-06-02 13:37:14 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174977635 Luke Ex 2 https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174978106 <!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="https://code.jquery.com/jquery-3.1.0.js"></script>

</head>

<body>

    <form>
        Name:<br>
        <input type="text" name="firstname">
        <button type="button">Submit</button>
    </form>
    <table id="nameTable">
        <TR>
            <TD>Jason</TD>
            <TD>Bourne</TD>
        </TR>
        <TR>
            <TD>Michael</TD>
            <TD>Jordan</TD>
        </TR>
        <TR>
            <TD>Peter</TD>
            <TD>Parker</TD>
        </TR>
    </table>




    <script>
        $("button").click(function() {
            var splitting = $('input').val().split(' ');
            var firstName = splitting.shift();
            var secondName = splitting.join();
            var initial = secondName.substring(0, 1) + ".";
            
//            var lastC = $("table tr").children.last
            
            $("#nameTable").append("<tr><td>" + firstName + "</td><td>" + initial + "<tr>")
            
            $("tr").children().last().mouseenter(function(event){
                $(event.target).text(secondName)
                console.log(event.target)
            })
            
            $("tr").children().last().mouseout(function(event){
                $(event.target).text(initial)
            })


        });  
    </script>

    

</body>

</html>

]]> 2017-06-02 13:40:03 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174978106 Luke Ex 3 CSS https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174980815 .capital{
    text-transform:capitalize;
}

]]> 2017-06-02 13:57:01 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174980815 Gosia Ex 3 gosiapietron https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174982392
<!DOCTYPE html>

<html>

<head>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>

<title></title>

</head>

<body>

<div>
<input id='x' type="text" name="name"><button id='a'>Submit</button>
<table id='c'>
</table>
</div>

<script type="text/javascript">

$('#a').on("click", function(){
var name = $('#x').val()

var z= name.split(" ")
var d= z[1].slice(0,1)+"."

$('#c').append('<tr><td>'+(z[0].substr(0,1).toUpperCase()+z[0].substr(1))+'</td><td>'+(d.substr(0,1).toUpperCase()+d.substr(1))+'</td></tr>')


$( "tr" ).children().last().mouseenter(
function() {
$(event.target).text(z[1].substr(0,1).toUpperCase()+z[1].substr(1))}
)
$( "tr" ).children().last().mouseleave(
function() {
$(event.target).text(d.substr(0,1).toUpperCase()+d.substr(1))}
)

})

</script>

</body>

</html>










]]> 2017-06-02 14:07:34 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/174982392 Luke Home Ex 1 CSS https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/175346494 .capital{
    text-transform:capitalize;
}

]]> 2017-06-06 08:55:18 UTC https://padlet.com/BarcelonaCodeSchool/qqv6hu790zez/wish/175346494