joehigh1
joehigh1

Reputation: 193

Changing tab title with jquery?

I'm working on this website for a friend, so on page refresh a constellation of letters is chosen randomly (and the tab title is changed to correspond), then between 9pm and midnight a constellation (called 'Gold Rocks') joins whichever is on the page ..

and we are hoping for the tab title to read whatever is on the page at the time + 'and Gold Rocks'.. for example..

where before tab was.. Lip Balm Goosebumps Work

between 9pm and midnight should be.. Lip Balm and Gold Rocks Goosebumps and Gold Rocks

Where am I going wrong with the code ?

Is it possible just using Javascript?

<title></title>

+

<script>

//CHOOSES CONSTELLATION + CHANGES TAB !

var chooses = Math.floor(Math.random() * 2) + 1;
var title = $(document).prop('title');

//LIPBALM !

    if (chooses == 1) {
document.write('<div class="lipbalm"><div class="lipbalm-l"><a href="http://sarahboulton.co.uk">L</a></div><div class="lipbalm-i"><a href="http://sarahboulton.co.uk">i</a></div><div class="lipbalm-p"><a href="http://sarahboulton.co.uk">p</a></div><div class="lipbalm-b"><a href="http://sarahboulton.co.uk">B</a></div><div class="lipbalm-a"><a href="http://sarahboulton.co.uk">a</a></div><div class="lipbalm-l2"><a href="http://sarahboulton.co.uk">l</a></div><div class="lipbalm-m"><a href="http://sarahboulton.co.uk">m</a></div></div>');

$(document).prop('title', 'Lip Balm');
}


//GOOSEBUMPS WORK !

    if (chooses == 2) {
document.write('<div class="goosebumpswork"><div class="goosebumpswork-g"><a href="http://sarahboulton.co.uk">G</a></div><div class="goosebumpswork-o"><a href="http://sarahboulton.co.uk">o</a></div><div class="goosebumpswork-o2"><a href="http://sarahboulton.co.uk">o</a></div><div class="goosebumpswork-s"><a href="http://sarahboulton.co.uk">s</a></div><div class="goosebumpswork-e"><a href="http://sarahboulton.co.uk">e</a></div><div class="goosebumpswork-b"><a href="http://sarahboulton.co.uk">b</a></div><div class="goosebumpswork-u"><a href="http://sarahboulton.co.uk">u</a></div><div class="goosebumpswork-m"><a href="http://sarahboulton.co.uk">m</a></div><div class="goosebumpswork-p"><a href="http://sarahboulton.co.uk">p</a></div><div class="goosebumpswork-s2"><a href="http://sarahboulton.co.uk">s</a></div><div class="goosebumpswork-w"><a href="http://sarahboulton.co.uk">W</a></div><div class="goosebumpswork-o3"><a href="http://sarahboulton.co.uk">o</a></div><div class="goosebumpswork-r"><a href="http://sarahboulton.co.uk">r</a></div><div class="goosebumpswork-k"><a href="http://sarahboulton.co.uk">k</a></div></div>');

$(document).prop('title', 'Goosebumps Work');
}


</script>

+

<script type="text/javascript">

//GOLD ROCKS ! only between 9pm and midnight

var currentTime = new Date().getHours();

//if it is between 9pm and midnight
if (21 <= currentTime && currentTime < 24) 
{
document.write('<div class="goldrocks"><div class="goldrocks-g"><a href="http://sarahboulton.co.uk">G</a></div><div class="goldrocks-o"><a href="http://sarahboulton.co.uk">o</a></div><div class="goldrocks-l"><a href="http://sarahboulton.co.uk">l</a></div><div class="goldrocks-d"><a href="http://sarahboulton.co.uk">d</a></div><div class="goldrocks-r"><a href="http://sarahboulton.co.uk">R</a></div><div class="goldrocks-o2"><a href="http://sarahboulton.co.uk">o</a></div><div class="goldrocks-c"><a href="http://sarahboulton.co.uk">c</a></div><div class="goldrocks-k"><a href="http://sarahboulton.co.uk">k</a></div><div class="goldrocks-s"><a href="http://sarahboulton.co.uk">s</a></div></div>');


$(document).prop('title', title+' and Gold Rocks');
}


</script>

http://sarahboulton.co.uk/kitchen.html

Thank you !

Upvotes: 1

Views: 713

Answers (1)

you can use that simply:

$("head title")[0];

Upvotes: 2

Related Questions