I assume your code is based on this example.
It really helps if you create a jsFiddle in order to explain your problem.
I created a jsFiddle for you which you can copy an update if needed.
Please check this jsFiddle in which I use the highlight and click select control on the first overlay. It's not necessary to use indeces.
I took out the console report in order to focus on the main parts which are as follows:
var wkt = new OpenLayers.Format.WKT();
var vectors1 = new OpenLayers.Layer.Vector();
map.addLayers([vectors1]);
var vector1 = wkt.read("POLYGON((0 0, 0 50, 50 50, 50 0, 0 0)");
vector1.geometry.transform(map.displayProjection, map.getProjectionObject());
vectors1.addFeatures([vector1]);
var vectors2 = new OpenLayers.Layer.Vector();
map.addLayers([vectors2]);
var vector2 = wkt.read("POLYGON((10 10, 10 60, 60 60, 60 10, 10 10)");
vector2.geometry.transform(map.displayProjection, map.getProjectionObject());
vectors2.addFeatures([vector2]);
var highlightCtrl = new OpenLayers.Control.SelectFeature(vectors1, {
hover: true,
highlightOnly: true,
renderIntent: "temporary" });
var selectCtrl = new OpenLayers.Control.SelectFeature(vectors1, {
clickout: true });
map.addControl(highlightCtrl);
map.addControl(selectCtrl);
highlightCtrl.activate();
selectCtrl.activate();
I hope this helps you.
EDIT:
I understand your problem now. You cannot use the select control with a z-index set on the overlay. The activation of the select control will always put the layers as defined in the control layer array on top during the activation event.
I suggest you use a different approach. You can use event listeners on the map object to achieve a hover & select functionality regardless of the z-index.
I forked my earlier jsFiddle to show how this can be achieved. Please have a look at this.