A couple of years ago, as a learning exercise, I wrote a little HTML/javascript game where you drag tiles around and drop them on an open cell in a 4x4 HTML matrix comprised of DIVs
and Ps
, to put the letters A through O (jumbled) into alphabetical order. I gave each cell in the P-matrix an id
like so:
<div id="t1">
<div class="row" data-row="0" id="row1">
<p class="sq" data-col="0" id="col1-1">A</p>
<p class="sq" data-col="1" id="col1-2">B</p>
<p class="sq" data-col="2" id="col1-3">C</p>
<p class="sq" data-col="3" id="col1-4">D</p>
</div>
<div class="row" data-row="1" id="row2">
<p class="sq" data-col="0" id="col2-1">E</p>
<p class="sq" data-col="1" id="col2-2">F</p>
<p class="sq" data-col="2" id="col2-3">G</p>
<p class="sq" data-col="3" id="col2-4">H</p>
</div>
<div class="row" data-row="2" id="row3">
<p class="sq" data-col="0" id="col3-1">I</p>
<p class="sq" data-col="1" id="col3-2">J</p>
<p class="sq" data-col="2" id="col3-3">K</p>
<p class="sq" data-col="3" id="col3-4">L</p>
</div>
<div class="row" data-row="3" id="row4">
<p class="sq" data-col="0" id="col4-1">M</p>
<p class="sq" data-col="1" id="col4-2">N</p>
<p class="sq" data-col="2" id="col4-3">O</p>
<p class="sq" data-col="3" id="col4-4"> </p>
</div>
</div>
And here is the relevant CSS:
p.draggable {
-webkit-user-drag: element;
}
I hadn't looked at it for a few years and took it out to play it on my iPhone. Now, when a P
element is dragged and dropped onto a "cell", I'm taken to the Bible Gateway website to the Colossians entry, as though there's some "intelligent" feature in the browser that is looking at the ID and concluding that somehow Colossians is involved, and the numbers in the ID are being used to select a particular passage!
Is there a name for this feature and can it be turned off either by the user or programmatically in javascript?