Rozszerzenie Chrome Proste wyskakujące okienko nie pozostanie w ostatnim stanie

Teraz jestem pewien, że niektórzy z was słyszeli o incydencie, który wydarzył się pod adresem Byron Nuclear Plant (co zdarza się w pobliżu), jak również ogromnej ilości trzęsień ziemi Stany Zjednoczone i Kanada. (BTW: Znalazłem this rozszerzenie którym można monitorować trzęsienia ziemi na całym świecie)Rozszerzenie Chrome Proste wyskakujące okienko nie pozostanie w ostatnim stanie

Zresztą ze wszystkie te kwestie dzieje Chciałem oglądać elektrowni jądrowych lepiej, a ja już wiedziałem o Radiation Network więc zrobiłem rozszerzenie chrome o nazwie Radiation Map, które jest zasilane przez sieć radiacyjną (chociaż nie jestem w żaden sposób powiązana z siecią radiacyjną)

Zrobiłem to nie tylko ja, ale każdy może monitorować poziom promieniowania w USA, Japonii, Ameryce Południowej i Europa. (Wiem, że nie zrobiłem dużo pracy, ale widzisz powód)

Jednak mam 1 problem, którego nie mogę zrozumieć. Kiedy mam otwarte okienko i oglądam poziom promieniowania w Japonii, a kiedy zamykam okienko, cofa się ono do pokazywania poziomów promieniowania w Stanach Zjednoczonych. Jak sprawić, aby pozostały w miejscu, w którym użytkownik zostawia to, powiedzmy w moim przypadku Japonia w tym przykładzie? (Próbowałem skryptów treści, ale z CSS i jQuery nie załadował)

Manifest

{ 
    "name": "Radiation Map", 
    "version": "1.0.1", 
    "description": "See what radiation levels are anywhere in the United States, South America, Japan, and Europe! Updated in real time every minute.", 

    "browser_action": { 
     "default_icon": "images/logo.png", 
     "default_title": "Radiation Map", 
     "popup": "index.html" 
    }, 

    "icons": { 
     "48": "images/48x48.png", 
     "128": "images/128x128.png", 
     "256": "images/logo.png" 
    } 
}

Popup

<html> 
<head> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/rmd.js"></script> 
</head> 
<body id="radiationmap"> 
    <div id="rmlbbg"></div> 

    <div id="topnavradiation"> 
     <ul id="menu"> 
      <div id="themedrop"> 
       <table> 
        <tr><td> 
         <button id="cus">Contiguous United States</button> 
        </tr></td> 
        <tr><td> 
         <button id="hawaii">Hawaii</button> 
        </tr></td> 
        <tr><td> 
         <button id="alaska">Alaska</button> 
        </tr></td> 
        <tr><td> 
         <button id="sa">South America</button> 
        </tr></td> 
        <tr><td> 
         <button id="japan">Japan</button> 
        </tr></td> 
        <tr><td> 
         <button id="europe">Europe</button> 
        </tr></td> 
       </table> 
      </div> 
      <li><button id="about">About</button></li> 
      <li><button id="home">Home</button></li> 
      <li><button id="location">Location</button></li> 
     </ul> 
    </div> 

    <div id="radiationmap"> 
     <div id="cusmap"> 
      <img src="http://www.radiationnetwork.com/GGFTPMap.jpg" width="752" height="478"> 
     </div> 
     <div id="alaskamap"> 
      <img src="http://www.radiationnetwork.com/Alaska.JPG" width="752" height="478"> 
     </div> 
     <div id="hawaiimap"> 
      <img src="http://www.radiationnetwork.com/Hawaii.JPG" width="752" height="478"> 
     </div> 
     <div id="samap"> 
      <img src="http://www.radiationnetwork.com/Paraguay.JPG" width="752" height="478"> 
     </div> 
     <div id="japanmap"> 
      <img src="http://www.radiationnetwork.com/Japan.JPG" width="752" height="478"> 
     </div> 
     <div id="europemap"> 
      <img src="http://www.radiationnetwork.com/Europe.JPG" width="752" height="478"> 
     </div> 

     <table width="752"> 
      <td><img src="images/LegendWeb.bmp"></td> 
      <td><img src="images/Nuclear.bmp"> Nuclear Site</td> 
      <td>Alert Level = 100 CPM</td> 
     </table> 
    </div> 

    <div id="aboutradiationmap"> 
     Radiation Map is powered by the <a href="http://radiationnetwork.com/" target="_blank">Radiation Network</a>, and without them this extension couldn't be possible. 

     <p><a href="http://www.youtube.com/mikethedj4" target="_blank">Michael</a> created this extension for obvious reasons, and is in no way affiliated with the Radiation Network.</p> 
     <hr> 
     <center>Take control over your life, and stay safe!<br /> 
     <em>Much Love!</em> 

     <p><a href="http://swagbucks.com/refer/mikethedj4" target="_blank"><img src="images/swagbucks.jpg"></a></p> 

     </center> 
    </div> 
</body> 
</html>

RMD.JS (efekty do ukrycia i pokaż inne mapy monitorujące poziom promieniowania)

$(document).ready(function() { 
    $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#europemap, div#themedrop, div#aboutradiationmap, div#rmlbbg').hide(); 

    $('button#home').click(function() { 
     $('div#rmlbbg, div#aboutradiationmap').fadeOut(400); 
     $('div#themedrop').slideUp(400); 
    }); 

    $('button#about').click(function() { 
     $('div#rmlbbg, div#aboutradiationmap').fadeToggle(400); 
     $('div#themedrop').slideUp(400); 
    }); 

    $('button#location').click(function() { 
     $('div#themedrop').slideToggle(400); 
    }); 

    $('button#cus').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#cusmap').delay(400).slideDown(400); 
    }); 

    $('button#europe').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#cusmap').slideUp(400); 
     $('div#europemap').delay(400).slideDown(400); 
    }); 

    $('button#japan').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#cusmap, div#europemap').slideUp(400); 
     $('div#japanmap').delay(400).slideDown(400); 
    }); 

    $('button#sa').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#cusmap, div#japanmap, div#europemap').slideUp(400); 
     $('div#samap').delay(400).slideDown(400); 
    }); 

    $('button#alaska').click(function() { 
     $('div#cusmap, div#hawaiimap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#alaskamap').delay(400).slideDown(400); 
    }); 

    $('button#hawaii').click(function() { 
     $('div#alaskamap, div#cusmap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#hawaiimap').delay(400).slideDown(400); 
    }); 

    $('div#rmlbbg').click(function() { 
     $('div#rmlbbg, div#aboutradiationmap').fadeOut(400); 
    }); 

});

Źródło

2012-02-01 Michael Schwartz

Strona jest ponownie ładowana po każdym otwarciu okna podręcznego, co oznacza, że stan nie będzie trwał automatycznie. Możesz użyć sessionStorage, aby zapamiętać ustawienie dla bieżącej sesji (lub nawet localStorage, jeśli chcesz, aby przetrwał restart przeglądarki). Coś takiego:

$(document).ready(function() { 

    ... 

    $('button#cus').click(function() { 
     $('div#alaskamap, div#hawaiimap, div#samap, div#japanmap, div#europemap').slideUp(400); 
     $('div#cusmap').delay(400).slideDown(400); 
     sessionStorage.selectedMap = "cus"; 
    }); 

    ... 

    // "Click" the button corresponding to the map previously selected 
    var selectedMap = sessionStorage.selectedMap || "cus"; 
    $('button#' + selectedMap).click(); 
});

Źródło

2012-02-01 08:19:08

Użytkownik otwiera rozszerzenie, klika na Alasce, zamyka rozszerzenie, otwiera je z powrotem i chciałbym, aby pozostało to, w jaki sposób użytkownik go opuścił. Przepraszamy za zamieszanie, ale w jaki sposób to rozwiązuje problem? –

@ mikethedj4: Prawdopodobnie powinienem być bardziej konkretny - to, o co prosisz, nie stanie się automatycznie. Strona zostanie ponownie załadowana za każdym razem, gdy zostanie otwarte wyskakujące okienko. Musisz więc zainicjować stronę w taki sposób, aby Twój poprzedni wybór był przestrzegany. To właśnie ilustruje mój kod. –

Tylko trochę wyjaśnić tę odpowiedź. Użycie localStorage zachowuje stan rozszerzenia po otwarciu i zamknięciu rozszerzenia, gdy sessionStorage tego nie robi. Domyślam się, że otwieranie i zamykanie rozszerzenia powoduje ponowne otwarcie wyskakujących okienek w nowym oknie/tabulacji, dzięki czemu operacja sessionStorage zostanie wyczyszczona. –

Rozszerzenie Chrome Proste wyskakujące okienko nie pozostanie w ostatnim stanie

Odpowiedz

Powiązane problemy