I'm trying to highlight every word on mouseover. I'm using node.js and express js. Here is a fiddle as example : https://jsfiddle.net/gsrgfd8e/
var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));
app.set('view engine', 'ejs');
//home
app.get('/', function(req, res) {
res.render('home');
});
// not found
app.get('*', function(req, res){
res.send('page not found');
});
app.listen(3000);
home.ejs
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="robots" content="noindex, nofollow">
<meta name="googlebot" content="noindex, nofollow">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://sites.google.com/site/aryandhaniblogv2/jquery-lettering-0-6-1-min/jQuery.lettering-0.6.1.min.js"></script>
<script type='text/javascript'>//<![CDATA[
window.onload=function(){
$(".word_split").lettering('words');
}//]]>
</script>
<style type="text/css">
#text{
width:60%;
margin: auto;
text-align:justify;
font-size:18pt;
}
.word_split span:hover {
background-color: #20B2AA;
color:white;
}
</style>
<title></title>
</head>
<body>
<div id="text">
<p class="word_split">Peki nedir bu Bulletproof Coffee? Efendim adından da anlayabileceğimiz gibi cumhurbaşkanının bilmemkaçyüzbindolar değerindeki aracı gibi kurşungeçirmez özelliği olduğuna inanılan, Batman’ e, Hulk’ a, Flash’ e, Black Widow’ a, Jon Snow’a, Kenan Komutan’a, Şebnem Ferah’a ve hatta ne istiyorsanız ona dönüşebileceğinizi vaat ettiği rivayet edilen bir kahve çeşidi. Bugüne dek birçok farklı kahve denemiş, hepsinden ağzınıza size düşen payı almış olmanız muhtemel fakat bu tarife kulak verseniz pek de kötü etmiş olmazsınız gibi geliyor.</p>
<p class="word_split">Size ölümsüzlük iksirinin bulunduğu müjdesini vermek isterdik lakin ne böyle bir iksir bulundu ne de buna gerek var. Size verdiği tek şey bünyeden bünyeye farklılık gösteren enerji etkisidir. Enerji dediysek öyle hemen içer içmez Galya’lı Asterix gibi Romalılara saldırmaya kalkmayın. Çünkü etkisi uzun zamanlı kullanımda kendini gösterecek bir kahve çeşididir. Tabi Obelix gibi kazana düşmediyseniz.</p>
<p class="word_split">Vakit kaybetmeden Bulletproof Coffee tarifimize geçerek kendimizi kurşungeçirmez yapalım.</p>
</div>
</body>
</html>
The page I get from localhost doesn't highlight the words like in the example. Javascript seems to work fine, after some testing. Maybe it's Jquery?
via Mica Ménard
No comments:
Post a Comment