problema con tabs al regresar se quede en la ultima tab visitada
Publicado por Eduardo (186 intervenciones) el 17/01/2021 03:03:13
Hola a todos nuevamente con mi preguntas de tabs que viene en este ejemplo el cual tengo un inconveniente en un tab por ejemplo tengo estas tabs pues tomo el ejemplo de esta web.. y en cada pagina mostrada en los tabs hay un enlace (acá pongo enlaces a paginas webs reconocidas por ejemplo) en mi caso es alguna pagina propia.. desearía que al regresar atras o cuando esa pagina que cargo haga el proceso que debe hacer al regresar a la pagina de los tabs esta se quede en el mismo tabs que use es decir no vuelva al inicio de los tab
he estalo leyendo y leyendo y he usado hasta # en los enlaces para anclas pero será que las uso mal pues no me funciona... me dicen que usando variables pero no se como.....
Espero me ayuden!!!
Aca pongo el code:
he estalo leyendo y leyendo y he usado hasta # en los enlaces para anclas pero será que las uso mal pues no me funciona... me dicen que usando variables pero no se como.....
Espero me ayuden!!!
Aca pongo el code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<style>
/* Style the tab */.tab {
overflow: hidden;border: 1px solid #ccc;
background-color: #f1f1f1;
}/* Style the buttons that are used to open the tab content */.tab button {
background-color: inherit;
float: left; border: none; outline: none; cursor: pointer; padding: 14px 16px;transition: 0.3s;
}/* Change background color of buttons on hover */.tab button:hover {
background-color: #ddd;
}/* Create an active/current tablink class */.tab button.active {
background-color: #ccc;
}/* Style the tab content */.tabcontent {
display: none; padding: 6px 12px;border: 1px solid #ccc;
border-top: none;
}</style>
<script>
function openCity(evt, cityName) {
// Declare all variablesvar i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide themtabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
} // Get all elements with class="tablinks" and remove the class "active"tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
} // Show the current tab, and add an "active" class to the button that opened the tabdocument.getElementById(cityName).style.display = "block";
evt.currentTarget.className += " active";
}</script>
<!-- Tab links --><div class="tab">
<button class="tablinks" onclick="openCity(event, 'London')" id="defaultOpen" >1</button>
<button class="tablinks" onclick="openCity(event, 'Paris')">2</button>
<button class="tablinks" onclick="openCity(event, 'Tokyo')">3</button>
</div>
<!-- Tab content --><div id="London" style="display:block" class="tabcontent">
<h3>TAB 1</h3>
<p>estas en el <a href="http://www.google.com"> tab 1 ir y ver</a></p>
</div>
<div id="Paris" class="tabcontent">
<h3>TAB 2</h3>
<p>estas en el <a href="http://www.adobe.com"> tab 2 ir y ver</a></p>
</div>
<div id="Tokyo" class="tabcontent">
<h3>TAB 3</h3>
<p>estas en el <a href="http://www.lawebdelprogramador.com"> tab 3 ir y ver</a></p>
</div>
Valora esta pregunta
0
